getTodo is not defined

I'm not doing anything special, but I can't load my todo:
// routes/index.tsx

import { createAsync, query, RouteDefinition } from "@solidjs/router";
import { ErrorBoundary, Show } from "solid-js";

type Todo = {
title: string
};

export const getTodo = query(async () => {
'use server';
const randomTodo = Math.floor(Math.random() * 200) + 1;
const todo = await fetch(`https://jsonplaceholder.typicode.com/todos/${randomTodo}`);
return await todo.json() as Todo;
}, 'todo');

export const route = {
preload: () => getTodo()
} satisfies RouteDefinition;


export default function Home() {
const todo = createAsync(() => getTodo());

return (
<main class="flex flex-col justify-center items-center mt-5 gap-3">
<h1 class="text-2xl">Todo</h1>
<ErrorBoundary fallback={<div>Something went wrong!</div>}>
<Show when={todo()}>
{(data) => (
<h2>{data().title}</h2>
)}
</Show>
</ErrorBoundary>
</main>
);
}
// routes/index.tsx

import { createAsync, query, RouteDefinition } from "@solidjs/router";
import { ErrorBoundary, Show } from "solid-js";

type Todo = {
title: string
};

export const getTodo = query(async () => {
'use server';
const randomTodo = Math.floor(Math.random() * 200) + 1;
const todo = await fetch(`https://jsonplaceholder.typicode.com/todos/${randomTodo}`);
return await todo.json() as Todo;
}, 'todo');

export const route = {
preload: () => getTodo()
} satisfies RouteDefinition;


export default function Home() {
const todo = createAsync(() => getTodo());

return (
<main class="flex flex-col justify-center items-center mt-5 gap-3">
<h1 class="text-2xl">Todo</h1>
<ErrorBoundary fallback={<div>Something went wrong!</div>}>
<Show when={todo()}>
{(data) => (
<h2>{data().title}</h2>
)}
</Show>
</ErrorBoundary>
</main>
);
}
Seems pretty simple error? J
2 Replies
mdynnl
mdynnl5d ago
try removing export from getTodo
jdgamble555
jdgamble555OP5d ago
lol, yup, that was it... thanks!

Did you find this page helpful?