Использование выпадающего списка v-select для значения по умолчанию

#vue.js #vuetify.js #v-select

#vue.js #vuetify.js #v-select

Вопрос:

У меня есть выпадающий список, использующий компонент v-select и устанавливающий мои параметры как «США» и «КАНАДА».

Я хочу установить значение по умолчанию ( :value ) для чтения customer.country_code , для которого в данном случае установлено значение «US», но у него нет предварительно загруженного выбора. Я использую v-select в подобных случаях, но не уверен, что я здесь путаю.

 <v-select
   :options="['US', 'CA']"                                   
   :value="customer.country_code"                                       
   v-model="defaultCountry"
</v-select>

 

v-модель defaultCountry запускается следующим образом:

 data() {
   return {
       defaultCountry: null
  }
},

props: {
    customer: { type: Object }
}
 

customer.country_code является реквизитом, поэтому я не могу создать экземпляр v-model для этого значения.

Комментарии:

1. сделать defaultCountry равным customer.country_code

2. v-model должен управлять значением, а не :value

3. в какой момент мне сделать defaultCountry равным этому? Я не верю, что prop доступен в data() { } точке

4. то есть вы можете просто использовать defaultCountry: this.props.customer.country_code

5. @DerekPollard weirdddd — это не работает как defaultCountry: this.props.customer.country_code , но работает как defaultCountry: this._props.customer.country_code . Почему это должно быть??

Ответ №1:

v-select как в компоненте vuetify?

ваша v-модель должна иметь значение ‘US’, и это будет первый выбранный элемент

Комментарии:

1. да, компонент vuetify — извините. Я собираюсь отредактировать свой вопрос с ответом ^

Ответ №2:

 dropdown.vue:

<select v-model="country">
  <option value="0">US</option>
  <option value="1">CANADA</option>
</select>

dropdown.js

In data declare this v-model.
country: 0

Then the default value "US" will be preselected in dropdown.

This is my first answer on stack overflow..hope it helps. ThankYou