svelte：从组件导入商店？

Question

我在一个简洁的组件（）中创建了一个可读的存储，src/components/myComponent.svelte如下所示

import { readable } from "svelte/store";

export let data;

const mags = data.magazines;
export const allMags = readable(mags);

console.log($allMags) // correct output

我想将此商店导入到我的src/store.js文件中，以便我可以使用它来创建派生商店。我已经尝试过以下方法：

import { writable, readable, derived } from "svelte/store";
import { allMags } from "../src/components/myComponent.svelte";
// console.log($allMags)

我遇到了以下错误：

client.ts:112 SyntaxError: 请求的模块 '/src/components/myComponent.svelte?t=1696086887675' 未提供名为 'allMags' 的导出（位于stores.js?t=1696086887675:2:10）

显然，记录 $allMags 不起作用，我收到此错误：

|- ReferenceError: $allMags is not defined  
   at eval (src/stores.js:8:13)  
   at async instantiateModule (/node_modules/vite/dist/node/chunks/dep-e8f070e8.js:54405:9)

Internal server error: $allMags is not defined

我认为（我是一个苗条的菜鸟）问题源于文件allMags中的导入store.js。这是不允许的吗？如果允许，我该如何修复导入语句？

Answer 1

1. 您不能从组件导入存储，除非它是从context="module"脚本导出的。任何其他导出都是组件实例的属性。
2. 即使您这样做，也无法使用Svelte 文件之外的$store语法。要获取一次存储值，请使用get效用函数。要持续接收商店更改通知，请使用subscribe商店本身的功能。