Karl
Karl
PostsComments
SSolidJS
Created by Karl on 7/19/2024 in #support
changing route with useNavigate() causes onMount() of the child route to be fired twice
Okay the problem was solved for me by usind <Show when={!ok.loading}> instead of Suspense. I still cant quite wrap my mind around it. Can someone hint me to resources to understand it?
4 replies
SSolidJS
Created by Karl on 7/19/2024 in #support
changing route with useNavigate() causes onMount() of the child route to be fired twice
Now when i click the buttons with onclick -> useNavigate(), the onMount() function of the subroutes gets executed twice. Any idea how to solve this?
4 replies
SSolidJS
Created by Karl on 7/19/2024 in #support
changing route with useNavigate() causes onMount() of the child route to be fired twice
Okay the issue arises because of <Suspense> 
// App.tsx
<Router>
        <Route path='/' component={Home}></Route>

        <Route path='/test' component={Test}>
          <Route path='/hallo1' component={Hallo}></Route>
          <Route path='/hallo2' component={Hallo2}></Route>
        </Route>
 </Router>
// App.tsx
<Router>
        <Route path='/' component={Home}></Route>

        <Route path='/test' component={Test}>
          <Route path='/hallo1' component={Hallo}></Route>
          <Route path='/hallo2' component={Hallo2}></Route>
        </Route>
 </Router>
function Test(props: any){

    async function fetchTest(){
        return new Promise(async (resolve, reject) => {
    
            setTimeout(() => {
                resolve('nice')
            }, 2000)
        })
    }

    const [ok, {mutate, refetch}] = createResource<any, any>(fetchTest)

    return(
        <div>
            <Suspense>
                
                <p>{ok()}</p>
                {props.children()}
            </Suspense>
            
        </div>
    )
}
function Test(props: any){

    async function fetchTest(){
        return new Promise(async (resolve, reject) => {
    
            setTimeout(() => {
                resolve('nice')
            }, 2000)
        })
    }

    const [ok, {mutate, refetch}] = createResource<any, any>(fetchTest)

    return(
        <div>
            <Suspense>
                
                <p>{ok()}</p>
                {props.children()}
            </Suspense>
            
        </div>
    )
}
function Hallo(props: any){
    const navigate = useNavigate()

    onMount(() => {
        console.log('hallo1')
    })

    return(
        <div>
            <button
                onclick={(() => {
                    navigate('/test/hallo2')
                })}
            >/hallo2</button>
        </div>
    )
}
function Hallo(props: any){
    const navigate = useNavigate()

    onMount(() => {
        console.log('hallo1')
    })

    return(
        <div>
            <button
                onclick={(() => {
                    navigate('/test/hallo2')
                })}
            >/hallo2</button>
        </div>
    )
}
function Hallo2(props: any){
    const navigate = useNavigate()

    onMount(() => {
        console.log('hallo2')
    })

    return(
        <div>
            <button
                onclick={(() => {
                    navigate('/test/hallo1')
                })}
            >/hallo1</button>
        </div>
    )
}
function Hallo2(props: any){
    const navigate = useNavigate()

    onMount(() => {
        console.log('hallo2')
    })

    return(
        <div>
            <button
                onclick={(() => {
                    navigate('/test/hallo1')
                })}
            >/hallo1</button>
        </div>
    )
}
4 replies
SSolidJS
Created by Karl on 3/3/2024 in #support
Struggling to understand the correct way to use createResource with a store
it works now thank you !
9 replies
SSolidJS
Created by Karl on 3/3/2024 in #support
Struggling to understand the correct way to use createResource with a store
because the data is local to the component but i need the data in other components as well. I tried to do the navigation in the getter but i couldnt use useNavigate(), because it was outside of the component tree. Thank you, i will try Suspense.
9 replies
SSolidJS
Created by Karl on 2/21/2024 in #support
solid-router without SSR and without having to redirect
Yes it works. Thanks!
6 replies
SSolidJS
Created by Karl on 2/21/2024 in #support
solid-router without SSR and without having to redirect
Alright, i will try to set this up. Thank you
6 replies
SSolidJS
Created by Karl on 2/21/2024 in #support
solid-router without SSR and without having to redirect
Okay i seem to misunderstand this then. Sorry i am relatively new to this and dont really understand. So it will be possible for the users to enter the specific routes? I will deploy with nginx, i will look into how i can redirect to the entrypoint. Thanks
6 replies