Как правильно обновить объект в массиве?

Question

У меня есть массив объектов, в моем коде я перечисляю эти

{#each advances as tech}
    <Advance tech={tech} addToCart={addToCart}/>
{/each}

Функция добавления в корзину обновляет переменную объекта:

  const addToCart = (tech) =>  {
      tech.Cart = true;
  }

Это не вызвать реактивность, как мне это сделать?

Answer 1

Один из способов сделать это - обратиться к элементу в списке, используя его индекс

{#each advances as tech, index}
    <Advance tech={tech} on:click={() => advances[index].cart = true}/>
{/each}

пример: https://svelte.dev/repl/70d4235faefd4f1b87ad6d359d02f05b?version=3

Answer 2

Предполагая, что вы хотите сделать больше, чем просто переключение флага, вы также можете сделать:

const addToCart = (tech) =>  {
  tech.Cart = true;
  advances = advances;
}

Это заставит вызвать триггер реактивности в массиве.