Блог

Главная - Вопросы по программированию - Как передать значение компонента его родительскому элементу?

Как передать значение компонента его родительскому элементу?

#javascript #components #parent #svelte #svelte-3

Вопрос:

Я хочу привязать значение элемента select в компоненте Svelte (Form.svelte) к переменной active в его родительском элементе (App.svelte). Я пробовал использовать bind:value={active} компонент формы в приложении, но это не работает, потому что мне нужно получить доступ к значению выбора. Как мне получить доступ к значению элемента select? Заранее спасибо.

Минимальный рабочий пример: https://svelte.dev/repl/bc872132e21f4071abe5a255728fb0ec?version=3.43.0

Ответ №1:

Вам нужно предоставить value свойство, если вы хотите привязаться к нему. Здесь мы также привязываем value свойство к select элементу, чтобы оно обновлялось с изменениями в выборе.

 /* Select.svelte */

<script>
    export let value
</script>

<select bind:value>
    <option value="1">one</option>
    <option value="2">two</option>
    <option value="3">three</option>
</select>

Затем вы можете привязаться к нему в своем родителе

 /* App.svelte */

<script>
    import Select from './Select.svelte'
    
    let active;
</script>

<Select bind:value={active}/>

<p>{active}</p>

ПОВТОРИТЕ

Метки: