SvelteKIt

Question

我正在将 SvelteKit 与 Typescript 结合使用。在 $lib 文件夹中，我有一个 .ts 文件。

我尝试从 .ts 文件中的 '$app/stores' 访问 user/session。

import { get } from 'svelte/store';    
import { session } from "$app/stores";

function getUser(){
  const {user} = get(session);
  console.log(user);
}

但是当调用该函数时，我在控制台中收到以下错误消息：

Uncaught (in promise) Error: Function called outside component initialization

我该如何解决这个问题？

非常感谢！

Answer 1

我不知道你在什么时候调用 getUser，但它可能在组件初始化之外的其他时间（否则你不会得到这个错误），这意味着你需要构建一个略有不同。

From the docs:

"...存储不是自由浮动的对象：必须在组件初始化期间访问它们，就像使用 getContext 访问的任何其他内容一样。 ...商店本身 (...) 需要在未使用 $-prefix 时在组件或页面初始化时同步调用。使用 getStores 安全地 .subscribe 改为异步。"

这意味着：

在此上下文中不要使用 session，使用 getStores 并自己分配给会话：const { session } = getStores()
确保在组件初始化期间调用 const { session } = getStores()。

示例：

import { get } from 'svelte/store';    
import { getStores} from "$app/stores";

function getUser() { // <- call this at component initialization
  const { session } = getStores();
 
  return {
    current: () => get(session).user
  }
}

SvelteKIt - 访问会话 - 调用外部组件的函数

SvelteKIt - Access session - Function called outside component

typescript

svelte