svelte - 类似发票的示例，用于了解数组中嵌套对象的反应性。我应该为此使用商店吗？

Question

我正在尽我所能理解使用 Svelte 3 创建类似发票的表单的惯用方式。

我的REPL在这里：https ://svelte.dev/repl/7aca36569aea49bba38e5fb8b1b0835b?version=3.24.1 。

问题：

1. 这是一个好方法吗？我应该使用商店吗？

2. qty当我改变我的行时，有没有办法更新 amountDue price？（我知道我可以做到，rows = rows但在我看来这有点不习惯，我错了吗？）

Answer 1

如果您需要更完整的答案：

1. 无需使用商店。当您想与多个组件进行通信时，通常就是这种情况。
2. 如前所述，您应该将row值绑定到 Row 的row道具。您可以将快捷方式bind:row用作 的别名bind:row={row}。
3. 次要：计算amountDue总价的逻辑似乎有缺陷，因为它忽略了计算总价的行数。

这是一个具有所需行为的有效 REPL：https ://svelte.dev/repl/78fa09646005441a85061e6edf9886f9?version=3.24.1

Answer 2

我认为您不需要使用商店（可能对大型组件树有用）

对于第二个问题，你只需要做一个组件绑定

https://svelte.dev/tutorial/component-bindings

{#each rows as row}
    <Row bind:row />
{:else}
    Still no rows.
{/each}

注意我们如何使用 bind 关键字而不是仅仅传递 prop