iview select数据重置问题

最新推荐文章于 2024-01-03 12:56:09 发布
最新推荐文章于 2024-01-03 12:56:09 发布
阅读量539 收藏 1
点赞数 1
分类专栏： iView 文章标签： view design
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xiazzww/article/details/127908211
版权

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

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

xiazzww
关注
专栏目录
iview Select 组件 过滤功能 多项条件过滤
shenmeyaonie的博客
08-24 584
<Select v-model="formValidate.val" filterable clearable multiple placeholder="请输入" > <Option v-for="item in uData" :key="item.e...
iview 表格选中触发的事件
kk
07-03 2044
在后台管理系统写表格时，默认每行数据前都有一个选择按钮，一般是选择选中删除，因此，就有多选删除，单选删除，全选删除。 下面iview的文档说明： 通过给columns数据设置一项，指定type: 'selection'，即可自动开启多选功能。 给 data 项设置特殊 key_checked: true可以默认选中当前项。 给 data 项设置特殊 key_disabled: true可以禁止选择当前项。 正确使用好以下事件，可以达到需要的效果： @on-select，选中某一项...
iview 表格重置 以及 选择器重置 以及 输入框重置
xiaoxin6661111的博客
08-08 504
iview 表格重置 以及 选择器重置 以及 输入框重置
iview select选中值取值_完美解决iview 的select下拉框选项错位的问题
weixin_39922868的博客
12-20 545
在使用iview的过程中，我遇到这样一个问题，在Model中使用select下拉框组件。但是当弹出框超过一屏需要滚动时，select的下拉选项会出现错位(下图1为正常，图2为滚动后，下拉选项错位。)图1：图2：在分析组件代码后，发现以下一个样式：.ivu-modal .ivu-select-dropdown {position: absolute !important;}解决方案正是这个样式影响了...
iview select 怎么清空_iView各种组件清空重置
weixin_39647787的博客
12-22 698
表单注意事项： prop属性要和表单对象中的属性名一致html:重置js:data () {return {formFilter: {},}},methods: {handleReset (name) {// 或者手动将各个属性置空this.$refs[name].resetFields()}}穿梭框html: 首先通过ref获取到穿梭框ref="refTransfer">js: 在想要清除...
iview切换Select时选项丢失，重置Seletc时选项丢失
yjl13598765406的博客
06-29 670
iview切换Select时选项丢失，重置Seletc时选项丢失
iview select 怎么清空_在使用iview时发现要先重置一下表单然后填写完后再重置可以清空Select多选框，否则清不掉，什么原因？...
weixin_39963830的博客
12-22 398
在使用iview时发现要先重置一下表单然后填写完后再重置可以清空Select多选框，否则清不掉html代码北京市上海市深圳市提交重置js代码export default {data () {return {formValidate: {name: '',city: []},ruleValidate: {name: [{ required: true, message: '姓名不能为空', trig...
iview-resetFields()重置
qq_39736671的博客
03-10 3383
iview-resetFields重置一.自己的方式二.组件提供的方式 最近在使用iview编写form表单的时候，由于对官方组件没读太多，直接上手，就按照自己的方式实现按钮reset重置事件，今天发现有现成的事件，起始都是大同小异。 自己的方式 组件提供的方式 一.自己的方式 闲话不说直接上案例 1.表单数据 <Form :model="vehicle" :label-wid...
iview前端向后端传数据一直转圈_记一次开发过程中，iview遇到的一些坑以及解决办法...
weixin_39959482的博客
12-22 811
写在开头：本次项目采用的是vue2.0+iview3.0，最近公司没啥事，来总结一下开发过程中遇到的问题。1、Modal关闭问题需求背景：modal框里面是个form表单，点击确定之后，先验证form表单，验证通过则关闭modal框，验证不成功则提示用户，不关闭。问题描述：本来刚开始想通过modal框v-model绑定的值(true或false)来进行控制，手动改之后，报错。解决办法：官方ivie...
使用iView遇到的问题和坑
微信-sjk6070
02-15 798
当单选框要绑定 number 类型的数值时，前面要加冒号（:） input 框绑定时要用 v-model，别用官方的 :value.sync Form中的input上加入clearable会在最后面显示一个清空按钮 下拉框优化： {{type.label}} typeList: [ { value: 1, label: ‘新势力’ }, { value: 0, label:...
iview实现图片上传功能
10-15
最后，`handleSubmit('formValidate')`和`handleReset('formValidate')`分别用于提交表单和重置表单，它们会调用iView的内置方法对表单数据进行验证和清理。 总结起来，iView的图片上传功能通过`<Upload>`组件提供...
iview框架form表单无法重置
weixin_42332641的博客
07-14 568
组件的model属性必须与表单组件的v-model属性的绑定对象一致 <Form :model="formItem" ref="formItem"> <FormItem label="交易类型:" :label-width="74" prop="payType"> <Select v-model="formItem.payType" placeholder="请选择交易类型"> <Option v-for="item
iview怎么重置form表单
范天缘的博客
09-06 1087
官方提供了一个api resetFields 对整个表单进行重置，将所有字段值重置为空并移除校验结果 cancelAdd的方法带的参数是你的ref名字 <Modal @on-cancel="cancelAdd('addMainValidate')"> <Form :model="mainForm" ref="addMainValidate" > <FormItem prop="contractNumber"> <Input
iview的Select选择器清空选择项操作
leilei__66的博客
01-04 4339
iview的Select选择器清空选择项操作 一、iview组件的自带的清空操作 二、自制input代替原input输入框 自制input代替原input输入框，实现删除输入随意
iview的form表单中对select下拉进行on-change操作时的小BUG
qq_32318311的博客
03-30 4427
需求是，在图1的下拉菜单进行操作，改变下拉菜单中选项时，改变图二中复选框的显示隐藏 首先iview的下拉菜单只能绑定两个值，label和value，而此时我需要后台给我的第三个值判断复选框的显示隐藏，没办法，还好后台总算给了一个value是唯一值，改变时对下拉菜单绑定的数组进行遍历判断。 然后就发生了如下的错误 想想真的没道理，value是下拉菜单的值，怎么就未定义了。 经过大佬的一番指导...
【第6期】使用Iview的Select组件进行远程搜索并在编辑时设置一个或多个默认值
最新发布
朱晓龙的博客
01-03 1805
本期要点 1. Iview Select组件的简单介绍 2. 后端编写学校搜索接口 3. 前端编写调用搜索接口的相关方法 4. Select组件触发远程搜索 5. 编辑时对已选择的数据设置默认值(1个和多个)
iview Select 数据不及时刷新问题
nikeit的博客
06-20 4045
<FormItem label="客户" prop="custname"> <Select v-model="formData.custname" :remote-method="getRemoteCustomer" ...
iview select 使用了多选multiple @on-change 方法会自动触发
不积跬步何以至千里
10-21 4042
今天也是神奇 遇到一个打着灯笼也找不到的bug 因为我是添加编辑共用同一个弹出框 然后今天做编辑的时候 发现 明明region后端字段获取到了 但页面鬼斧神差的不显示 如下图 console.log都打印出来东西 就是不上页面 value的值也是对的 然后就很无奈 能怎么办 这时候就查找整个页面里 有存储区域的字段 发现有个地方我把他清空了 我把这句话屏蔽 居然又显示了 但 这是on-ch...
iview的select组件实现联动问题解决
yoohoo1234的博客
11-15 4610
遇到的问题： 1、下拉框选项中我分明选择的是戏曲2学院，结果在显示框中显示的是电影2学院 原因是因为select的option在遍历的时候，与上个遍历的list的key值一样导致的，使key一直保持唯一就好 2、联动的时候，第一个select的值变动的时候，第二个select的选项默认选中上次选中的位置 如上图，所属学校变化的时候，所属院系的值为空，当打开下拉框的时候发现，第二个值...
iview select下拉框错位
09-04
iview select下拉框错位可能是由以下几个原因引起的： 1. CSS样式问题：iview select组件使用了一些CSS样式来控制下拉框的位置，如果其他自定义的CSS样式与之冲突，可能会导致下拉框错位。可以通过检查页面中的CSS样式，特别是与select相关的样式，来解决该问题。 2. 容器宽度过小：如果iview select组件所在的容器宽度设置不够大，无法容纳下拉框的全部内容，可能会导致下拉框错位。可以尝试调整容器的宽度或使用CSS中的white-space属性来解决该问题。 3. 数据项过多：如果下拉框中的选项较多，iview select组件会自动将下拉框显示在页面可视区域内。但如果页面高度不够大，可能会导致下拉框错位。可以尝试减少下拉框的选项数量或调整页面布局以适应更多的选项。 4. 版本兼容性问题：iview select组件的某些版本可能存在bug，导致下拉框错位。可以尝试更新或降级iview的版本，或者查阅iview的官方文档或论坛，寻求解决该问题的具体方法。 总之，iview select下拉框错位可能是由CSS样式问题、容器宽度、数据项数量或版本兼容性等多种原因造成的。通过调整相关的设置或代码，可以解决该问题。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值