Vue js, как показать option в select выбранный по умолчанию?

Question

[paradoks92]

Имеет такой Select:

<select class="form-control"  v-model="selectedSport" v-on:change="onChange" :class="{ 'borderRed': trueFlagSport}">
                                            <option value="" hidden selected disabled >Выбери спорт</option>
      <option v-for="(item, index) in itemsSport" :key="index" :value="item.value">@{{item.name}}</option>
                                            </select>

По дефолту, мне нужно чтобы был выбрал option: "Выбери спорт". Но что-то не выходит.
Не очень хорошо шарю в Vue.js, но когда убираю v-model, все ок.
Что имеем сейчас:

Answer 1

[0xD34F]

Указывать атрибут selected бессмысленно - v-model его игнорирует. Вместо этого, задайте свойству selectedSport в качестве начального значения пустую строку - как в value нужного вам option'а.

Comments

[barder]

Доброго времени суток, вопрос конечно давно написан но немного та же ситуация, но я не понимаю что сделать.
Имеется option:

<select v-model="gorod" id="gorod" name="gorod" class="form-control form-control-sm">

					<?while($ar_fields = $my_elements->GetNext()){?>

						<?if ($ar_fields['ID'] == $arGorodID) {?>
							<option value="<?=$ar_fields['ID']?>" selected><?=$ar_fields["NAME"]?></option>
						<?}else{?>
							<option value="<?=$ar_fields['ID']?>"><?=$ar_fields['NAME']?></option>
						<?}
						}?>
				</select>

мне нужно когда условие "$ar_fields['ID'] == $arGorodID" истина выбирался элемент по умолчанию.
метод mounted не помогает.
Заранее спасибо за ответ.