iview select数据重置问题

最新推荐文章于 2023-06-29 10:08:48 发布
原创 最新推荐文章于 2023-06-29 10:08:48 发布 · 750 阅读 · 1 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
标签
#view design
本文讨论了iView Select组件在动态选项变化时触发on-change事件的问题，特别是当v-model绑定值变为undefined时，会出现两次事件调用的情况。文章提供了一种解决方案，在事件处理函数中增加对undefined值的判断并返回，同时更新v-model的值。

当iview select 的option是循环出来的就有可能遇到这种问题，当我们更改option循环的数组数据时候，select会自动触发一次on-change事件，且回调为undefied（即为selecte绑定的数据v-model为undefined），同时碰到的场景就是：同时会调用两次事件，且最后一次事件回调是udefined

解决办法：在on-change事件里判断，如果回调是undefined时  return,跳出函数，并且重新给select绑定的变量赋值

vue的iview框架select组件远程搜索，选中后不刷新的问题
u011558902的专栏
07-31 7704
UI框架采用了iview，用的select组件的自动补全功能，也就是select组件的远程搜索功能 问题描述：第一次输入查询关键字，匹配到一条数据，选中后，再次输入查询关键字，如果和上次匹配到的条数length相同，选中时候结果发现匹配到的结果还是上一条的，并没有刷新。 解决过程：很是郁闷。断断续续弄了一周，猜想各种可能性，还在项目里的node_modules文件夹iview的源码里写cons...
iview 表格重置 以及 选择器重置 以及 输入框重置
xiaoxin6661111的博客
08-08 636
iview 表格重置 以及 选择器重置 以及 输入框重置
iview里面的select 组件v-model为空时，回调的时是undefined
weixin_41184962的博客
09-28 2297
iview里面的select 组件数据重置之后，会回调一个 undefined, 因为select里面的v-model会自动匹配 option的值，当v-model为空时，在option中找不到这个值，匹配不上，就会回调undefined. 解决方法： 给v-model的变量赋初始值（这个初始值必须是option里面能找到的值，可以匹配得上的），如 v-model=‘option’ <!--option 里面多加这行，匹配初始值的情况--> <Option value="0" label=
iview Select 数据不及时刷新问题
nikeit的博客
06-20 4181
<FormItem label="客户" prop="custname"> <Select v-model="formData.custname" :remote-method="getRemoteCustomer" ...
iview切换Select时选项丢失，重置Seletc时选项丢失
yjl13598765406的博客
06-29 833
iview切换Select时选项丢失，重置Seletc时选项丢失
View UI （iview） select 标签选中值，重置为空后，值为 undefined
悟世君子的博客
07-29 6346
View UI，即原先的 iView，从 2019 年 10 月起正式更名为 View UI，并使用全新的 Logo 问题描述：在使用 View UI （iview） 的 select 标签时，无意间发现一个问题，就是在select 标签中选中一个值，然后将 select 标签置空，获取 select 标签中的值为 undefined，此处正常应该为设置的空值，但实际却是undefined。有趣的是点击 2 次重置为空按钮后，却能获取到设置的空值 代码如下 <template&gt..
iview select选中值取值_iView的Select选择框
weixin_39922147的博客
12-20 3326
目录在此先列出解决了那些问题，以防读者看完了没有用处：1、示例，最基础的使用方法2、传参，传多个值的方式3、默认值4、清空重置无效5、可搜索的用法及如何限制搜索字符长度一、示例html:{{item.name}}js:data: {formSend: {name: '',code: ''},dataList: [{id: 1,name: '中国',code: 'china'}]},methods:...
iview select 怎么清空_iView各种组件清空重置
weixin_39647787的博客
12-22 774
表单注意事项： prop属性要和表单对象中的属性名一致html:重置js:data () {return {formFilter: {},}},methods: {handleReset (name) {// 或者手动将各个属性置空this.$refs[name].resetFields()}}穿梭框html: 首先通过ref获取到穿梭框ref="refTransfer">js: 在想要清除...
iview中select的使用
zhixuexingchen的博客
09-02 2929
1、示例，最基础的使用方法 2、传参，传多个值的方式 3、默认值 4、清空重置无效 5、可搜索的用法及如何限制搜索字符长度 一、示例 html: <Select @on-change=“getItemValue” v-model=“formSend.code”> {{item.name}} js: data: { formSend: { name: ‘’, code: ‘’ }, d...
element iview vue重置表单不起作用？ this.$refs.searchForm.resetFields()； this.$refs[form].resetFields()；
热门推荐
小哈力----一个小前端工程师
05-12 1万+
vue项目出现这种无法重置表单问题，按照下面的5步，挨个检查一遍，基本问题就解决了。如果还是解决不掉，欢迎留言。 本方法同时适用于iview和element Ui
iview前端向后端传数据一直转圈_iview 踩坑之旅
weixin_39869043的博客
12-22 316
公司重构管理系统，框架定了vue，UI在element和iview之间选，element样式被吐槽丑，于是选了iview，但是，，这个坑多啊。。。废话少说，罗列了iview中容易出错或者懵逼的一些地方，希望后来的老哥们少费点头发。#环境：vue-2.5, iview-3.0.1#避免你浪费时间，先列出要点：1，重置表单；2，校验表单；3, Table相关；4，select相关。1，重置表单1)单...
iview 踩坑之旅
weixin_30488085的博客
03-25 270
公司重构管理系统，框架定了vue，UI在element和iview之间选，element样式被吐槽丑，于是选了iview，但是，，这个坑多啊。。。 废话少说，罗列了iview中容易出错或者懵逼的一些地方，希望后来的老哥们少费点头发。 #环境：vue-2.5, iview-3.0.1# 避免你浪费时间，先列出要点： 1，重置表单； 2，校验表单； 3, Table相关； 4，sele...
iview表单提交系列问题
weixin_43021174的博客
08-29 7292
1 重置的时候上传图片未清空 &lt;Upload ref="upload" action="http://10.0.0.4:8004/uploadPic"&gt; &lt;Button type="ghost" icon="ios-cloud-upload-outline"&gt;上传 &lt;/Button&gt; &lt;/Upload&gt;
iview 级联选择组件_踩iviewui中Select 选择器两级联动，重置查询条件时第二级数据无法清除的坑...
weixin_39811150的博客
12-22 606
小颖公司最近做的项目用的vue+iviewui+axios，在做项目的过程中，遇到一个问题：二级联动的下拉框，第一个下拉框一直都有值，第二个下拉框是在选择了第一个下拉框之后采取调用ajax获取其值，但当点击重置按钮时，所有的查询条件都要置空，所以这时第二个下拉框的 option 的值也应是空的，但事实是虽然小颖在点击重置按钮时把第二个下拉框的option绑定的值置空了，但它还是能获取到数据，最后定...
iview前端向后端传数据一直转圈_记一次开发过程中，iview遇到的一些坑以及解决办法...
weixin_39959482的博客
12-22 934
写在开头：本次项目采用的是vue2.0+iview3.0，最近公司没啥事，来总结一下开发过程中遇到的问题。1、Modal关闭问题需求背景：modal框里面是个form表单，点击确定之后，先验证form表单，验证通过则关闭modal框，验证不成功则提示用户，不关闭。问题描述：本来刚开始想通过modal框v-model绑定的值(true或false)来进行控制，手动改之后，报错。解决办法：官方ivie...
iview经验踩坑
Coder Ben's Writing
04-15 668
1. Col 栅格 1. bootstrap列在xs屏幕默认占满一行，iview列在xs屏幕下必须设置24才能占满一行 2. List 列表 1. ```<ListItem>```上无法绑定点击事件，解决方式： 1. 在```<ListItem>```和内容直接加一层```<div```>，把事件绑定在```<div&gt...
iview、filterable、reset之后变成筛选状态的问题
stucker的博客
07-12 444
问题是这样的： select需求需要使用filterable实现可筛选，但是使用iview的resetFields之后，发现v-modal所绑定的值变成了undefined，并非初始化的formItem值。 这就导致问题出现，我选择值之后，重置，下拉框只剩我之前选中的option，虽然框中的值清空了，但是触发了筛选，筛选的值就是我上一次选中的值。开始解决： 先说我的问题是怎么解决的：将:key 的值与option中label的值保持一致为item.name
iview关闭抽屉弹层时清空Select弹框高亮样式
lianwenxiu的博客
06-11 1601
用iview做后台管理系统，首页数据列表页，点击新增按钮会弹出一个弹层，那个弹层用的是iview里的Drawer抽屉组件，里面的下拉框都是iview里的select组件，在新建完一条以后，再次打开下拉框里还会遗留上次选择过的样式，后来才知道需要用到一个方法clearSingleSelect。 解决方案：在Select元素上定义一个ref属性，取到Select框，在点击取消时的...
iview前端向后端传数据一直转圈_记一次开发过程当中，iview遇到的一些坑以及解决办法...
weixin_39641450的博客
12-22 801
写在开头：本次项目采用的是vue2.0+iview3.0，最近公司没啥事，来总结一下开发过程当中遇到的问题。前端一、Modal关闭问题vue需求背景：modal框里面是个form表单，点击肯定以后，先验证form表单，验证经过则关闭modal框，验证不成功则提示用户，不关闭。ajax问题描述：原本刚开始想经过modal框v-model绑定的值(true或false)来进行控制，手动改以后，报错。后...
工作遇到的问题总结 - vue+iview
weixin_30594001的博客
09-27 476
使用iview的分页的时候，怎么使分页回到默认页面，比如第一页,一定要写上.sync否则不起作用 <Page :total="addtotal" size="small" :current.sync='pageSizeOpts.curr'></Page> VUE中axios进行表单请求的配置 vue中，使用axios进行请求，使用了proxyTabl...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值