Hvordan binde verdien av en utvalgt inngang, med dynamisk opprettet alternativer i Svelte

stemmer
0

Jeg har en svelte komponent med en velgerinngang, som er fylt med data fra en ekstern kilde.

Hvordan kan jeg binde velgerinngangen gjør slik at en bestemt alternativet er valgt.

Hvis jeg gjør opsjonsverdier eller valgt verdi statisk, virker det til å fungere fint, men ikke hvis begge er dynamisk.

Her er min kode

<script>
    export let params = {}

    let seasons = [];
    let selected = '';

    onMount(async () => {
        selected = params.seasonId; 
    /* fetch is called here and returns a list of seasons, which is passed to seasons array */
    })
</script>

<p><select bind:value={selected}>
    <option value= disabled>-- Select Season --</option>
    {#each seasons as season}
    <option value={season.id}>{season.description}</option>
    {/each}
</select></p>
<p>param: {params.seasonId}</p>
<p>Selected: {selected}</p>

Fra koden, er dette HTML-utgang.

<p><select>
    <option value= disabled>-- Select Season --</option>
    <option value=4>2019</option>
    <option value=3>2018</option>
    <option value=2>2017</option>
    <option value=1>2016</option>
</select></p>
<p>param: 3</p>
<p>Selected: 3</p>

Jeg forventer at når siden er lastet, alternativ 3 2018 vil bli valgt, men det endrer ikke og - Velg Season - er det alternativet som er valgt.

Publisert på 09/10/2019 klokken 12:56
kilden bruker
På andre språk...                            


2 svar

stemmer
0

I denne forenklede eksempel på koden din dette synes å fungere: https://svelte.dev/repl/d95c63158f944ce996aaef092e4bff73?version=3.12.1

Jeg må være oppmerksom på at hvis du endrer den opprinnelige valgte verdien til

let selected = 3;

Det nytter ikke lenger fungerer, så problemene er i verdien av params.seasonId

Svarte 10/10/2019 kl. 14:48
kilden bruker

stemmer
0

Dette bør fungere fint.

Uten å se mer kode, ville min gjetning være at params.seasonIdog season.ider av forskjellig type (den ene strengen og den andre tall)

Svarte 09/10/2019 kl. 13:25
kilden bruker

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more