【问题标题】:Svelte - how to use methods in template?Svelte - 如何在模板中使用方法?
【发布时间】:2019-01-02 11:42:37
【问题描述】:

使用 vue,我通常会将任何复杂的逻辑提取到方法中,例如

<li v-for="todo in todos" v-show="!isTodoComplete(todo)">
  {{ todo }}
</li>

但是当我尝试用同样的方法使用 svelte 时:

{#each todos as todo}
    <li hidden={isComplete(todo)}>{todo}</li>
{/each}
...
methods: { isComplete (todo) { ... } }

我收到错误TypeError: ctx.isComplete is not a function

我做错了吗?这么苗条的事情怎么办?

【问题讨论】:

    标签: svelte


    【解决方案1】:

    Svelte 区分 helpersmethods

    Helpers 是模板中用于处理数据的函数——它们应该是纯函数,并且除了作为参数传入的内容(例如 @987654324 @对象)。

    方法事情的函数,通常是为了响应一个事件。他们确实可以访问组件状态。

    在这种情况下,isComplete 应该是一个助手,而不是一个方法。

    【讨论】:

    • 谢谢 Rich,对我来说,helpers 看起来更像 vues 过滤器。是故意决定让他们无国籍还是很难让他们进入状态?也许我可以阅读任何文档/文章?
    • 这是故意的。与方法不同,您无法控制 何时 函数运行——它只是根据需要经常运行以保持最新状态——因此这些函数没有副作用很重要。这里的文档svelte.technology/guide#helpers
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-11-24
    • 1970-01-01
    • 1970-01-01
    • 2022-01-09
    • 1970-01-01
    • 2010-12-04
    • 2014-04-04
    相关资源
    最近更新 更多