#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>