Я хочу сделать две переменные реактивными в обоих направлениях. Это означает, что если я изменяю, скажем, переменную a
, то я хочу, чтобы переменная b
изменялась, заданная некоторой определенной функцией, а если я изменяю переменную b
, то я хочу, чтобы a
менялась той же функцией, но наоборот:
$: b = 2 * a
$: a = 1/2 * b // This lines makes these dependencies cyclical.
У меня есть этот REPL, чтобы показать, что я хочу. Как я могу достичь этого? (В идеале с помощью умных стройных назначений, таких как знак $, но решения «on: input» также будут работать.)
Я переместил одно присваивание в функцию (реактивные операторы не анализируют функции, которые они вызывают) и получил желаемые результаты: REPL
Одно предостережение: как вы можете видеть из консоли, хотя изменение b
запускает только задание a
, как мы и хотели, изменение a
запускает оба задания. Я попробовал несколько вещей, но не смог получить обе переменные, вызывающие только другое назначение, используя только реактивные ($:
) операторы, хотя это должно быть выполнимо с решением on:input
.
(Между прочим, я являюсь автором двустороннего производного хранилища, которое гарантирует вызов только одного обратного вызова при изменении любого конца, но это может быть чрезмерным для ваших нужд.)
На самом деле мы можем упростить, не используя $:
для этого случая. Как насчет?
<script>
let a = 1;
</script>
<input type = "number" bind:value = {a} > <br>
<input type = "number" value = {2 * a} on:change = {(e) => a = 1/2 * e.target.value}>