我想知道是否有可能在 axios promise 回傳多個選項后動態添加 ion-select-option 到 ion-select,例如,如果 axios promise 回傳 x=5,則向已經創建的 ion-select 添加 5 個 oprions。
這是離子選擇代碼(有單個離子選擇選項):
<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
}
}
uj5u.com熱心網友回復:
如果有人想知道,我找到了解決方案。
<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);
}
}
}
這按我的預期作業。
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/312548.html
標籤:javascript Vue.js 离子框架 公理
