iview的select加filterable多点击几次数据会减少

那是遇知吧

已于 2023-06-16 16:24:09 修改

阅读量244

点赞数

文章标签： view design vue.js

于 2023-06-16 11:17:04 首次发布

本文链接：https://blog.csdn.net/weixin_41406727/article/details/131243205

版权

当使用Vue的filterable特性时，如果在change事件中观察到选中值前有空格，可能是因为选项标签(label)的设置。文章提到可以通过调整Option标签的属性，例如label和value的绑定，来避免空格的出现。这个问题涉及到前端开发中的数据绑定和事件处理。

摘要由CSDN通过智能技术生成

这个问题的产生应该是因为有空格，filterable选中值后，再点击change事件获取的值就是前面加了空格，可以写在label里面

<Option :label="item" :value="item" v-for="item in list" :key="item"
                                    >
                                </Option>

关注博主即可阅读全文

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

那是遇知吧

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

iview Select 组件过滤功能多项条件过滤

shenmeyaonie的博客

08-24

623

<Select v-model="formValidate.val" filterable clearable multiple placeholder="请输入" > <Option v-for="item in uData" :key="item.e...

iview使用select组件设置filter属性后导致获取值有空格问题

ljxbbss的博客

01-08

755

<form-item prop="cityId" label="所属城市"> ## @on-change="change" <i-select v-model="allEditParam.cityId" filterable :disabled=disabledData @on-change="cha...

参与评论您还未登录，请先登录后发表或查看评论

iview的Select组件filterable

小划乐的博客

04-01

6828

<FormItem label="国家"> <Select v-model="country" ref="sel" filterable> <Option v-for="item of countryList" :value="item.name" :key="item.id" > {{item.name}} </Op...

iview中select使用filterable的问题

qq_43033251的博客

06-02

1620

iview,select,fiterable

iview select filterable属性使用下拉bug

OldStreet61的博客

01-11

5866

今天做项目时候在iview 原生自带的select中设置filterable，下拉时候可进行查询，但是发现选中载打开模态框每次都绑定上一次的值，解决方案就是在关闭弹框时候将this.$refs.select.setQuery(null)，解决问题。解决方案，来自于以下链接：转自：https://www.cnblogs.com/victory820/p/10145485.html 1场景：弹框...

iview select filterable属性使用小陷井

热门推荐

素钗一生推

09-06

1万+

开了一个内容管理系统，使用了webpack vue 构建了一个iview项目，在列表当中使用新增，编辑弹窗时，有碰到一个使用select控件（select 设置了filterable属性），在编辑赋值之后，修改，保存之后，去新建，由于在编辑那一步有重新修改值，导致 select 的 query不为空，最终导致新建弹出的下拉选择项只有前一次操作选中的项，上个图，看看编辑选择的结果：再次新...

iview select filterable属性使用下拉小bug

weixin_30782331的博客

01-14

482

今天做项目时候在iview 原生自带的select中设置filterable，下拉时候可进行查询，但是发现选中载打开模态框每次都绑定上一次的值，解决方案就是在关闭弹框时候将this.$refs.store.setQuery(null)，解决问题。场景：当select选中项和数组同时变更，选中项会变为undefined，我查了很多的资料，最后，根据https://blog.csdn.net/Ol...

vue + iview select 远程搜索可以按多个参数查询

shenmeyaonie的博客

10-28

906

html: <Select v-model="model13" filterable :remote-method="remoteMethod1" :loading="loading1" style="width: 200px" > <Option v-for="(option, index) in

iview select多选远程搜索，不清空关键字

renamayu的专栏

04-13

1271

<template> <Row> <Col span="12"> <Select ref="selectName" v-model="model14" multiple filterable remote :remote-method="remoteMethod2" :loading="loading2" @on-change="onChange" @on-query-change="handleSelectChange"> <O.

iview的下拉框select无法渲染数据问题

大圣即大盗

01-28

9440

问题代码： &lt;FormItem label="选择系统：" &gt; &lt;Select style="width:350px" v-model="systemFolderName" placeholder="请选择系统" @on-

iview 下拉select样式_【Vue】iview select filterable新增的时候，关键字不存在的时候，下拉框显示的是根据关键字搜出来的结果，求解！...

weixin_30802367的博客

02-01

332

filterableplaceholder="可输入关键字搜索"v-model="pId"style="width:863px;"@on-change="onSelectChange"v-for="item in pIdList":value="item.ID+'|'+item.fullId+'|'+item.fullTitle":key="item.ID">{{ item.fullTitl...

iview中select的使用

zhixuexingchen的博客

09-02

2726

1、示例，最基础的使用方法 2、传参，传多个值的方式 3、默认值 4、清空重置无效 5、可搜索的用法及如何限制搜索字符长度一、示例 html: <Select @on-change=“getItemValue” v-model=“formSend.code”> {{item.name}} js: data: { formSend: { name: ‘’, code: ‘’ }, d...

iview下拉框select添加filterable造成的bug

OldStreet61的博客

03-22

3530

在使用select下拉框的过程中，需要进行查询，因此添加了filterable属性，但是造成bug，导致第二次选择只有上次选中的结果，解决方案如下： 1、在Select中添加ref="dataSet"属性。 <Select v-model="bindData" class="selectCss" ref="dataSet" filterable> &...

vue中Select支持模糊搜索（ iview ）

前端工程师，博文都是自己学习到的，或者开发中遇到的点，记录一下

12-18

1245

<Form-item label="厂商名称" prop='vendor_id'> <Select v-model="formRight['vendor_id']" :transfer="true" filterable multiple> <Option v-for="(item, index) in vendors" :value="item.id" :key="index"> {{item...

iview设置了filterable后第二次进入后只有第一次选择的值

weixin_30764771的博客

07-06

322

第一次选中bbb 第二次进入就只有bbb 解决方案: 在新增过着修改之前加一句 this.$refs.selectRef.setQuery(null) 即可转载于:https://www.cnblogs.com/jsli/p/11142526.html...

iview、filterable、reset之后变成筛选状态的问题

stucker的博客

07-12

327

问题是这样的： select需求需要使用filterable实现可筛选，但是使用iview的resetFields之后，发现v-modal所绑定的值变成了undefined，并非初始化的formItem值。这就导致问题出现，我选择值之后，重置，下拉框只剩我之前选中的option，虽然框中的值清空了，但是触发了筛选，筛选的值就是我上一次选中的值。开始解决：先说我的问题是怎么解决的：将:key 的值与option中label的值保持一致为item.name

iview的Select组件远程搜索的BUG优化--以及JS函数节流的应用

秋刀鱼笛滋味

11-27

4246

iview的Select组件远程搜索的优化使用业务场景：模糊搜索姓名，点击选择 template: &lt;Select style='width:200px;margin-right:20px' @on-change='check' clearable filterable remote :remote-method='fuzzySearch' :loading="loading1" pla...

iview一个下拉选项Select可以踩到这么多坑?

weixin_45369440的博客

06-22

1652

最近在做前端一个下拉选项的功能. 如图,选择软件时,后面的下拉框可以从后端获取对应的软件列表这里用的是vue+iview框架的select. <Select v-model="model1" style="width:200px" @on-change: "getType"> <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option

vxe-table 筛选渲染filter-render 自定义组件

wanghanlu_的博客

05-26

5914

3.1在main.js文字中导入vxetableRenderer.js文件。1.创建vxetableRenderer.js文件。2.创建filterModal.vue文件。3.2在你的列配置中使用。

iview select onchange走2次