svelte - Svelte 選択ブロックが正しく更新されない

Question

2 つの選択ドロップダウンを取得しました。最初の選択の値に基づいて、2 番目の選択内のオプションを動的に変更しようとしています。
奇妙なことに、ハードコードされた値を試してみると、すべてがスムーズに進みます。
データベース (MongoDB を使用) からデータを取得しようとするとすぐに、ストアからデータを取得すると、2 番目の選択が適切に更新されません。

ここにいくつかのコードがあります：

App.svelte

<script>
    import { text } from "svelte/internal";
    import { onMount } from "svelte";
    import axios from "axios";
    import {
        clientelaTargets,
        tipologiaOffertas,
    } from "./shared/stores/CachedStores.js";
    import { get } from "svelte/store";

    let people = [];
    let offerte = [];
    let offerteList = [
        { code: "Alpha", descr: "Alpha Offer", fkTargetClientela: "1", id: 1 },
        { code: "Beta", descr: "Beta Offer", fkTargetClientela: "1", id: 2 },
        { code: "Gamma", descr: "Gamma Offer", fkTargetClientela: "1", id: 3 },
        { code: "Delta", descr: "Delta Offer", fkTargetClientela: "1", id: 4 },
        { code: "Omega", descr: "Omega Offer", fkTargetClientela: "2", id: 5 },
    ];
    let targetList = [
        { code: "1", descr: "Target 1", id: 11 },
        { code: "2", descr: "Target 2", id: 22 },
        { code: "3", descr: "Target 3", id: 33 },
    ];
    let fk_target_clientela = "";
    let fk_offerta = "";
    onMount(async () => {
        const { data } = await axios.get("/api/users");
        people = data;
        const resCT = await fetch("/api/clientelaTargets");
        $clientelaTargets = await resCT.json();
        const resTO = await fetch("/api/tipologiaOffertas");
        $tipologiaOffertas = await resTO.json();
    });
//This is now retrieving hard-coded data, to switch, change offerteList to $tipologiaOffertas
    $: offerte = offerteList.filter(
        (item) => item.fkTargetClientela === fk_target_clientela
    );

</script>

<main>
    <div class="select-container">
        <label>Target Client *
            <br />
            <br />
            <div class="select">
                <select bind:value={fk_target_clientela}>
                    {#each targetList as item (item.id)}
                        <option value={item.code}>{item.descr}</option>
                    {/each}
                </select>
            </div>
        </label>
        <label>Offer Type *
            <br />
            <br />
            <div class="select">
                <select bind:value={fk_offerta}>
                    {#each offerte as item (item.id)}
                        <option value={item.code}>{item.descr}</option>
                    {/each}
                </select>
            </div>
        </label>
    </div>
</main>

CachedStores.js

import {writable} from 'svelte/store';
export const clientelaTargets = writable([]);
export const tipologiaOffertas = writable([]);

データベースから取得したデータは、基本的にハードコーディングされたものと同じです。助けてくれてありがとう！