我正在制作一个模态,其属性存储在商店中。而不是像这样打开它,从一个元素:on:click={() => $modal.isOpen = true}
我想像这样打开它:on:click={() => $modal.toggle()}
从一个元素。
这是我的代码:
export const modal = writable({
isOpen: false,
title: 'Title',
content: 'Content',
toggle: () => {
console.log(modal)
modal.set({ ...modal, isOpen: true });
}
});
当我登录时
modal
,它只记录 set, subscribe, update
方法。然后当我再次单击时,这些方法消失了:它正确地覆盖了它们,似乎我永远无法获得模态的初始化状态。我尝试使用 this
访问当前对象或参数( (a, b) =>
)但都不返回任何内容。
最佳答案
参数传递给 writable
只包含数据,不包含方法。要创建自定义商店,请执行以下操作 this tutorial — 创建您自己的包装工厂 writable
:
const toggleable = initial => {
const store = writable(initial);
return {
...store,
toggle: () => store.update(n => !n)
};
};
const modal = toggleable(false);
演示在这里:https://svelte.dev/repl/682ef8309f924ba7ad8de1e2f5069988?version=3.12.1
关于svelte - 如何在 svelte 中使用自定义存储方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58610895/