Как установить значение из элемента управления bootstrap-vue-select для предварительного выбора при загрузке формы?

Я использую VueJS, или, если быть более точным, Bootsrap-Vue (выберите тип формы). В шаблоне у меня есть следующий код:

<b-form-select>                   
  <option v-for="(selectOption, indexOpt) in item.select.options" 
         :selected="selectOption == item.select.selected ? 'selected' : ''"
         :key="indexOpt"
         :value="selectOption"
  >
    {{ selectOption }} - {{ selectOption == item.select.selected }}
  </option>
</b-form-select>

Где соответствующие данные определены как:

let item = {
  label: "some text goes here",
  inputType: 'text',
  select: {
      selected: '15',
      options: [
         '5',
         '10',
         '15',
         '20'
      ]
  }
}

Из вывода в пользовательском интерфейсе мы видим, что условие оценивается правильно (условие для проверки элемента "15" возвращает "true"). Вот как выглядит элемент управления select:

Если я проверяю HTML, он выглядит так:

НО, что мне нужно здесь, чтобы иметь возможность при загрузке элемента управления передать параметр в " item.select.selected ", чтобы фактически показать, какую опцию из элемента управления select нужно предварительно выбрать (при загрузке страницы). Во многих опциях, которые я пробовал, мой элемент выбора не выбирается при загрузке страницы.

Есть ли способ добиться этого?

1 ответ

Решение

Вы можете привязать значение по умолчанию непосредственно к <select> с v-model, Если вы связываете это с item.select.selected это должно показать это в выборе.

<b-form-select v-model="item.select.selected">                   
    <option v-for="(selectOption, indexOpt) in item.select.options" 
        :key="indexOpt"
        :value="selectOption"
    >
        {{ selectOption }} - {{ selectOption == item.select.selected }}
    </option>
</b-form-select>

Вот ваш код со значением по умолчанию: https://jsfiddle.net/adampiziak/eywraw8t/146114/

документы: https://vuejs.org/v2/guide/forms.html
другой ответ: установить значение по умолчанию для меню выбора опций

Другие вопросы по тегам