记一个关于 Select 的小 bug:Select 的 on-change 事件会自动触发

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>

在这里插入图片描述

以上。

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值