I wonder if there is possibility to dynamically add ion-select-option to ion-select after axios promise returns number of options, for example if axios promise returns x=5 then add 5 oprions to already created ion-select.
Here is ion-select code (there is single ion-select-option):
<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>
Here is axios function which is triggered on button click:
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
}
}
If anybody wonder, I found solution.
<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);
}
}
}
This works as I expected.