Динамический ионный выбор-параметры после получения данных от axios promise

#javascript #vue.js #ionic-framework #axios

Вопрос:

Интересно, есть ли возможность динамически добавлять опцию ion-select в ion-select после того, как axios promise вернет количество опций, например, если axios promise вернет x=5, затем добавьте 5 оприонов к уже созданному ion-select.

Вот код выбора ионов (есть один вариант выбора ионов):

 <ion-item>
      <ion-label>Some label</ion-label>
      <ion-select class="some class" value="1" interface="popover">
        <ion-select-option value="1">1</ion-select-option>
      </ion-select>
</ion-item>
 

Вот функция axios, которая запускается при нажатии кнопки:

 methods: {
    onClickFunction(){
       axios.post("http://some_php.php", formData)
        .then(res => {
            x = res.data[2]; // <-- this is number of options
            // here I want to add x * ion-select-option
   }
}
 

Ответ №1:

Если кому-то интересно, я нашел решение.

 <ion-item>
      <ion-label>Some label</ion-label>
      <ion-select placeholder="1" v-model="selectedOption" interface="popover">
        <ion-select-option v-for="(item, index) in tab" :key="index" 
           :value="item">{{item}}</ion-select-option>
      </ion-select>
</ion-item>
 
 data() {
    return {
      tab: []
    },
created() {
    onClickFunction(){
       axios.post("http://some_php.php", formData)
        .then(res => {
            x = res.data[2]; 
            for (let i = 1; i <= res.data[2]; i  ){
              this.tab.push(i);
            }
   }
}
 

Это работает так, как я и ожидал.