小编Hut*_*tzz的帖子

双向绑定在 Svelte 中非常出色且优雅，但我经常遇到的情况是需要双向绑定以及转换类型或进行某种清理的中间转换。例如：

• value绑定到具有以下形式的选择组件的 prop{value, label}，但其父组件仅处理一个值
• 类型转换，其中 a<input type=text>也是某种其他类型（数字、日期、自定义类型）的输入，或者将对象编辑为 JSON 的输入，该对象也可以从外部更改。

我的问题是：在 Svelte 中解决此模式的最佳、惯用且简单的方法是什么？

到目前为止，我发现的最好的可重用解决方案是创建一个用于一对一转换的商店工厂a，该工厂返回两个商店，然后b您可以使用它们并将其绑定到其他组件：

示例：在这里使用 REPL

// App.svelte
<script>
    import oneToOne from './oneToOne.js'
    
    const f = x => JSON.stringify({x});
    const fInv = x => {try{return JSON.parse(x).x} catch(err){return NaN}};
    
    let [a, b] = oneToOne(13, f, fInv); 
</script>

A: <input bind:value={$a}/>
B: <input bind:value={$b}/>

// oneToOne.js
import { writable } from 'svelte/store';

const identity = x => x;

export default function …