在Svelte #await之后以任何方式调用javascript函数:then

时间:2019-08-28 22:55:19

标签: javascript svelte

在Svelte #await :then之后,有什么方法可以调用javascript函数?我想在以下代码中执行的操作是,一旦我创建了带有某些ID的空数据表,就调用了javascript表,然后在javascript中将数据添加到Datable中。因此,基本上我想在JavaScript函数中传递data1和DataTable或dataTable元素本身的ID。有什么办法可以做到吗?

<div>
  <h1> Title</h1>
  {#await promise}
    loading...
  {:then data}
    {#each data as data1, i}
      <DataTable id={data1.title}/>
      <br />
      ---> I want to call javascript function here which would add data in the given data table. How can I do that?
    {/each}
  {:catch error}
    <kat-alert header="Error" description={error.message} variant="warning" />
  {/await}
</div>

1 个答案:

答案 0 :(得分:2)

我不确定您要做什么,但是如果您要创建的DataTable应该接收数据,为什么不简单地将其传递给它呢?

{#each data as data1, i}
   <DataTable id={data1.title} data={data1.actualdata}/>
{/each}

或者,您可以向组件本身添加一个事件。

{#each data as data1, i}
   <DataTable id={data1.title} use:fillTable{data1, data1.title}></DataTable>
{/each}

<script>
  const fillTable = (el, data, id) => () => {
     // el would be the created element
     // data and id were passed on in the #each
  }
</script>

第三种方法是将promise移出标记,并将逻辑放在脚本标签本身中,这将需要使用一些额外的变量来跟踪加载,错误等……但最终可能会更干净如果您想添加很多与承诺解决方案本身相关的额外操作。我想那儿变得越来越有品味了。