Svelte中的同步类状态

Question

我有一个类，它有一些更新状态的方法。在Svelte中，班级的真实状态不同步，我知道这是正确的行为，因为没有新的作业。确保对象的状态与DOM保持同步的最佳方法是什么？

以下是REPL示例：https://svelte.dev/repl/394676df2221456d923f23acc03c3f76?version=3.46.4

Answer 1

您可以使用writable存储：

创建存储的函数，该存储的值可以从"外部"组件。

工作示例：https://svelte.dev/repl/e7bb5633696d4e939c90f701bce2cfb2?version=3.46.4

---

您可以创建一个自定义商店，就像在自定义商店教程中一样，例如：

export function makeUser(name, age){
const {update, subscribe} = writable({
loading: false,
name,
age
})

return {
incrementAge: async () => {
update((s) => ({...s, loading: true}))

await new Promise(r => setTimeout(r, 2000))

update((s) => ({...s, age: s.age + 1, loading: false }))
},
subscribe,
}
}

工作示例：https://svelte.dev/repl/4ff2b92282b8455387357529ccb9e3a9?version=3.46.4