page.params 在 SvelteKit 中未定义

Question

我是 SvelteKit 的新手。我阅读了文档（我正在尽力遵循并遵循使我的网站正常运行的内容）。

在我的src > routes > posts > [postId].svelte：

<script>
    // http://localhost:3000/posts/[postId]

    import PostDetails from '../../components/pages/PostDetails.svelte';
</script>

<PostDetails />

在我的src > components > pages > PostDetail.svelte：

<script>
   import { page } from '$app/stores';

   console.log({ page });
   console.log('page.params', page.params);
</script>

<h1>Post Title</h1>

我想得到page.params.postId但它不起作用。所以我决定在控制台上记录page和的值：page.params

正如文档中所述，我期望{ host, path, params, query }从这个对象中获取page。但我除了一个subscribe函数什么也没得到。我究竟做错了什么？请帮忙。

Answer 1

pagefrom$app/stores是一个商店，这意味着您需要subscribe它才能获取当前值。这是因为该值不是固定的，而是在每次页面更新时更新。要轻松订阅商店，请在其前面添加一个$符号：

<script>
   import { page } from '$app/stores';

   // manually (don't forget to unsubscribe in onDestroy to avoid memory leaks)
   page.subscribe(currentPage => console.log(currentPage));

   // easier
   console.log({ page: $page });
   console.log('page.params', $page.params);
</script>

<h1>Post Title</h1>

文档$app/stores： https: //kit.svelte.dev/docs#modules-$app-stores
自动订阅文档$：https://svelte.dev/docs#4_Prefix_stores_with_$_to_access_their_values