記一個關於 Select 的小 bug:Select 的 on-change 事件會自動觸發
阿新 • • 發佈:2018-12-07
iView Select 框在頁面載入的時候會彈出還沒有觸發的方法裡面的錯誤資訊,如下:
程式碼:
<Select v-model="form.id" filterable clearable @on-change="selectAccount">
<Option v-for="account in accountsList" :value="account.id" :key="account.id">
{{ account.name }}({{ account.id }})
</Option>
</Select>
form.id
-1
,報錯資訊是寫在 selectAccount
函式裡,頁面載入的時候(mounted
中)還沒有觸發這個方法,但是錯誤資訊已經提示了。說明 form.id
的值已經改變了,在 watch
中檢測發現 form.id
的值由 -1
變成 ''
了。
然後我就知道問題出在哪了(///▽///)
是因為 accountsList
中沒有 id
是 -1
的, form.id
的值改變了就會觸發 selectAccount
函式從而彈出錯誤資訊。
解決辦法是給一個預設 Option
值是 -1
,如下:
<Select v-model="formCampaign.act_id" filterable clearable @on-change="selectAccount"> <Option :value="-1"> 請選擇廣告賬戶 </Option> <Option v-for="account in accountsList" :value="account.id" :key="account.id"> {{ account.name }}({{ account.id }}) </Option> </Select>
以上。