использование действия: не обновляется - PullRequest
0 голосов
/ 25 мая 2020

У меня есть тонкий компонент, когда я пытаюсь создать форму, а также js файл с формой logi c. Я хочу использовать действие для регистрации каждого ввода внутри формы. Монтирование и размонтирование работают хорошо, но обновление, похоже, не работает.

код: https://svelte.dev/repl/dd57165f12ce4029b905dcfcefb6e783?version=3.22.3

Любая помощь приветствуется.

1 Ответ

0 голосов
/ 25 мая 2020

Это не должно работать таким образом ...

return {
  update(value) {
    fields.update((n) => ({ ...n, [name]: value }))
  },
  destroy() {
    // ...
  },
}

Обратите внимание на документацию и пример

Действие может иметь параметры. Если у возвращаемого значения есть метод обновления, оно будет вызываться всякий раз, когда эти параметры изменятся, сразу после того, как Svelte применил обновления к разметке.

<script>
    export let bar;

    function foo(node, bar) {
        // the node has been mounted in the DOM

        return {
            update(bar) {
                // the value of `bar` has changed
            },

            destroy() {
                // the node has been removed from the DOM
            }
        };
    }
</script>

<div use:foo={bar}></div>

параметр bar передается в foo функция и привязана к элементу, что означает, что она уже является реактивной. В вашем примере вы передаете значение, которое является значением stati c, взятым во время монтирования, которое не будет обновляться.

Вы можете добавить прослушиватель событий непосредственно в node в вашем регистре function

const onUpdate = (event) => {
    fields.update((n) => ({ ...n, [name]: event.target.value }))
}

node.addEventListener('change', onUpdate);

Может быть более стройный способ привязать значение, которое затем позволит вам использовать вашу функцию обновления, но это работает.

...