Как передать элемент из каждого цикла в функцию - PullRequest
Новая
       13

Как передать элемент из каждого цикла в функцию

2 голосов
/ 24 июня 2019

У меня есть компонент, который содержит: 

{#each menuItems as item}
<div  class="menu-item {item.selected ? 'selected' : ''}" on:click={select(item)}>
    ...stuff...
</div>
{/each}

menuItems - это массив объектов: 

$: menuItem = [{
id: 'abc',
selected: true,
}]

У меня есть функция с именем select, которая должна получить элемент изкаждый цикл в качестве параметра.Как бы я это сделал?Текущий пример не работает из-за on:click, требующей такой функции, как on:click={submit}.Я пробовал в кавычках, и это тоже не сработало.

1 Ответ

3 голосов
/ 24 июня 2019

При написании on:click={select(item)} вы вызываете функцию select непосредственно при рендеринге. Вы хотите дать on:click ссылку на функцию, и вы можете сделать это, создав новую встроенную функцию для каждого элемента в цикле.

Пример ( REPL ) 

<script>
  const menuItems = [
    {
      id: 'abc',
      selected: true
    },
    {
      id: 'def',
      selected: false
    }
  ];

  function select(item) {
    alert(item.id);
  }
</script>

{#each menuItems as item}
  <div
    class="menu-item {item.selected ? 'selected' : ''}"
    on:click={() => select(item)}
  >
    {item.id}
  </div>
{/each}
...