How can I refresh a store in svelte?

Question

In my svelte app I have a store with an empty list. The list might get populated later by an external function. How can I get the app to recognize the new data (in this case after two seconds have elapsed)?

REPL

App.svelte

<script>
    import Cars from './Cars.svelte'
</script>

Cars.svelte

<div>
    {#each $cars as car}
        <p>{car}</p>
    {/each}
</div>
<button class="select-button">Save</button>


<script>
    import { cars } from './store.js'
    $cars = $cars
</script>

store.js

import { writable } from 'svelte/store'

let blank_cars = [];
let raw_cars = ['Audi', 'Aston Martin', 'BMW'];

export var cars = writable(blank_cars);

setTimeout(function() {
    cars = writable(raw_cars);
    console.log ('cars updated')
}, 2000)

Answer 1

use set instead of creating a new writable, like:

cars.set(raw_cars)

Working example: https://svelte.dev/repl/d2d602cd256844d883285c03b3537f9a?version=3.46.6