Svelte 不会从输入更新派生值

【问题标题】：Svelte isn't updating a derived value from an inputSvelte 不会从输入更新派生值
【发布时间】：2019-09-21 22:37:36
【问题描述】：

当我加载页面时，$greeting 会显示正确的值。

由于某种原因，当我更改 input 中的文本时，它没有更新。

App.svelte

<script>
    import { name, greeting } from './stores.js';
</script>

<h1>{$greeting}</h1>
<input value={$name}>

stores.js

import { writable, derived } from 'svelte/store'

export const name = writable('world')

export const greeting = derived(
    name,
    $name => `Hello ${$name}!`
)

【问题讨论】：

标签： svelte svelte-component svelte-store

【解决方案1】：

您需要像这样在input 上bind:value：

<input bind:value={$name}>

您拥有它的方式仅适用于页面加载。在那之后，它没有监听input 的变化，这就是$name 没有更新的原因。

bind:value 类似于在 HTML 中做 onchange：

<input
    onchange="event => name.set(event.target.value)"
    value={$name}
>

【讨论】：