S
SolidJS•2y ago
gmnss1917

How to pass key into createRouteData function inside useRouteData ?

Is this even possible ? I can't understand the docs
5 Replies
mdynnl
mdynnl•2y ago
gmnss1917
gmnss1917OP•2y ago
aren't these params just the url params ? I will try anyway
Carlo Nyte
Carlo Nyte•2y ago
Replied this in the general channel 
export function routeData({ params }: RouteDataArgs<{userId:string}>) {
    return createRouteData<boolean,string>(
        async(userId) => {
        const response = await fetch(`${API_URL}/specialUser/${userId}`)
        .then(res => {
            if (res.ok) {
                return res;
            }
            return false;
        })

        if (!response) return false;

        return true;
        },
    // This is using the userId from the url to create a key for the data
    { key: () => params.userId },
    );
}


export default function SecretPage() {
    const data = useRouteData<typeof routeData>();

    return (
        <div>
            <h1>SecretPage</h1>
            {data.error && <p>{data.error}</p>}
            <Show when={data()} fallback={ <div>User is not allowed</div>}>
                <div>User can see secrets</div>
            </Show>
        </div>
    )
}
export function routeData({ params }: RouteDataArgs<{userId:string}>) {
    return createRouteData<boolean,string>(
        async(userId) => {
        const response = await fetch(`${API_URL}/specialUser/${userId}`)
        .then(res => {
            if (res.ok) {
                return res;
            }
            return false;
        })

        if (!response) return false;

        return true;
        },
    // This is using the userId from the url to create a key for the data
    { key: () => params.userId },
    );
}


export default function SecretPage() {
    const data = useRouteData<typeof routeData>();

    return (
        <div>
            <h1>SecretPage</h1>
            {data.error && <p>{data.error}</p>}
            <Show when={data()} fallback={ <div>User is not allowed</div>}>
                <div>User can see secrets</div>
            </Show>
        </div>
    )
}
As far as I know you can't pass custom keys or signals unless they are top level/ global variables to any routeData function other that the route parameters some/path/[id] and useLocation() but I could be wrong
gmnss1917
gmnss1917OP•2y ago
yeah, that kinda sucks but okay, I can rearchitect around this thanks for the clarification
Carlo Nyte
Carlo Nyte•2y ago
No problem. The way I do it is to just use createResource and use the signal as my argument which will fire once the signal is updated And you can have the signal be updated in the onMount function. So it's essentially working the same just done manually plus more control

Did you find this page helpful?