面试题：Svelte中如何基于readable存储实现复杂数据衍生

Question

假设你有一个包含多个对象的数组的writable store，对象结构为{id: number, value: string}。现在需要创建一个readable store，它的值是数组中所有对象value属性组成的新数组，并且当writable store中的数据发生变化时，readable store能自动更新。请写出完整的Svelte代码实现。

Answer 1

<script>
    import { writable, readable } from'svelte/store';

    const writableStore = writable([
        { id: 1, value: 'a' },
        { id: 2, value: 'b' }
    ]);

    const readableStore = readable([], (set) => {
        const unsubscribe = writableStore.subscribe((data) => {
            const newValues = data.map(item => item.value);
            set(newValues);
        });
        return () => unsubscribe();
    });
</script>

{#each readableStore as value}
    <p>{value}</p>
{/each}