How to dynamically append data to a table?

[atresnjo]

I'm trying to append data dynamically to a table, how can I accomplish this? The table isn't updating.

<script>
  import Grid from "gridjs-svelte"

  let data = [
    { name: "John", email: "john@example.com" },
    { name: "Mark", email: "mark@gmail.com" },
  ]

    const add = () => {
        const item = {name: 'test', email: 'test'}
        data = data.slice(0).concat(item)
        console.log(data)
    }
</script>

<button on:click={add}>
    add
</button>
<Grid data={data} />

<style global>
  @import "https://cdn.jsdelivr.net/npm/gridjs/dist/theme/mermaid.min.css";
</style>

https://svelte.dev/repl/3a3035a8858d4c60b1683497b1a8c559?version=3.35.0

Thanks! :)

[atresnjo]

Solved it myself.

Feels hacky though, so feel free to suggest another way.

instance.updateConfig({ data }).forceRender();