苗条组件的输出

Question

当我在页面上添加苗条的组件时，我创建了类的新示例。

import ComponentA from "./Component.svelte";
let component = new ComponentA({...});

<ComponentA/>

并且每次组件销毁并再次创建。
但是我需要保存组件的状态。
(例如：块的显示、块的位置、文本等等(
当我创建新的示例时，我可以将其放在全局变量中。我可以从全局输出吗？这是真的吗？

Answer 1

首先，了解商店。

例

例如，要在 App.svelte 组件中保存滚动位置(并且在更改组件或 ...(：

导出存储中的变量.js

export const AppY = writable(0);

然后将您的 Y 位置(使用 svelte：scrollY 的 App.svelte 组件(绑定到变量。
在您的应用程序中：

import { AppY } from "../stores.js";
// some code
let Y = ... // bind your svelte:scrollY  here
$: $AppY = Y;

现在，您的可写存储中有了 scrollY 位置。 要长时间保存此位置，可以使用localStorage。