Svelte, повторно отображать только элемент в списке, а не весь список
Оба с svelte-apollo
(https://github.com/timhall/svelte-apollo/issues/19) и@urql-svelte
(https://github.com/FormidableLabs/urql/issues/704) У меня выполняется повторная визуализация всего списка, а не только повторная визуализация элемента.
Этапы воспроизведения:
перейдите в REPL: https://codesandbox.io/s/urql-svelte-list-rerendering-uwsvn
нажмите кнопку
рендеринг каждой кнопки; поэтому весь список перерисовывается
Я ожидаю, что он повторно отобразит только кнопку, которую я нажал
Если я читаю здесь: https://svelte.dev/tutorial/svelte-options, я понимаю это, используя:
immutable={true} - вы никогда не используете изменяемые данные, поэтому компилятор может выполнять простые проверки ссылочного равенства, чтобы определить, изменились ли значения.
immutable={false} - по умолчанию. Svelte будет более консервативен в отношении того, изменились ли изменяемые объекты.
Если вы видите пример, они меняют todos
массив, как мы делаем с urql
:
let todos = [
{ id: 1, done: true, text: 'wash the car' },
{ id: 2, done: false, text: 'take the dog for a walk' },
{ id: 3, done: false, text: 'mow the lawn' }
];
function toggle(toggled) {
todos = todos.map(todo => {
if (todo === toggled) {
// return a new object
return {
id: todo.id,
text: todo.text,
done: !todo.done
};
}
// return the same object
return todo;
});
}
Почему не работает с моим REPL todos
пример?
Является todos
новый массив в конце?