Svelte Sortable拖放列表不会更新

时间:2020-10-18 00:42:58

标签: svelte sortablejs

我正在使用Svelte构建组件,其中有一个单词列表,您必须通过将单词拖到答案部分来按正确的顺序排列它们,为此,我正在使用SortableJS

SortableJS

要存储答案和可以使用的单词,我会使用Svelte存储,并且一切正常。现在,我正在尝试执行相同的操作,但是有一个onClick事件。但是我有一个错误,其中存储值被更新,但是视图没有更新。

要显示选项和答案,我正在这样做:

<div
  class="chips"
  use:sortable="{{ items: answer, options: { group: 'chips', forceFallback: false } }}"
>
  {#each get(answer) as chip, index}
    <span class="chip" on:click="{handleAnswerClick(chip, index)}">
      <spain class="tag is-medium">{chip}</spain>
    </span>
  {/each}
</div>

并且如果我将get中的{#each get (answer) as chip, index}替换为$answer,则onClick`事件有效,但现在拖动的行为异常并带有错误。

这里是codesandbox,上面已说明了两种选择

0 个答案:

没有答案