element UI 自定义传参的解决方法

已于 2022-04-27 15:12:38 修改
阅读量375 收藏
点赞数
分类专栏： js vue 文章标签： js vue.js
于 2022-04-01 18:28:05 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Web_Notes/article/details/123904747
版权
js 同时被 2 个专栏收录
51 篇文章 0 订阅
订阅专栏
vue
27 篇文章 0 订阅
订阅专栏
这个博客介绍了如何在Vue项目中使用el-autocomplete组件来创建一个自动补全输入框，并添加了@select事件处理函数，实现了当选中某项时触发特定操作的功能。示例代码展示了v-model绑定、fetch-suggestions异步获取建议数据以及placeholder属性的用法。
摘要由CSDN通过智能技术生成 
<el-autocomplete
  v-model="state4"
  :fetch-suggestions="querySearchAsync"
  placeholder="请输入内容"
  @select="(item) => {handleSelect(item, index)}" // 写个闭包就可以了，index表示第几个组件
></el-autocomplete>
一个打工仔的笔记
关注
专栏目录
关于element-ui的采坑实录 使用心得
laodu1898的博客
04-29 623
el-autocomplete 这个是element-ui的输入框下拉，嘛。。可以在你输入的时候出现一个下拉，进行配置的时候还可以将你输入的东西与下拉框的内容进行匹配，然后下拉框会显示匹配的内容 先来看一个实现从远程搜索的下拉筛选，看下图官网代码，:fetch-suggestions="querySearchAsync"是element-ui的原生定义函数，这里是定义下拉内容的函数方法，rest...
element表单内嵌表格，table多行数据自定义校验以及自定义传参
卡卡罗特的博客
09-16 1061
element表单多行数据自定义校验以及自定义传参
ElementUI，在事件中传递自定义参数的两种方式
莫诺库诺的博客
06-26 6787
在使用ElementUI的时候，组件的事件会返回一些参数或者事件，有的时候我们想在这个时间点传入自己代码中的参数，因此在这里记录两种传递自定义参数的方式。
Element UI 的输入框
10-12 4593
Input 输入框 通过鼠标或键盘输入字符。 Input （el-input）为受控组件，它总会显示 Vue 绑定值。 通常情况下，应当处理 input 事件，并更新组件的绑定值（或使用v-model）。否则，输入框内显示的值将不会改变。 不支持 v-model 修饰符。 基础用法 禁用状态 通过 disabled 属性指定是否禁用 input 组件 可清空 使用clearable属性即可得到一个可清空的输入框。 ...
elementUI调用组件方法除自带参数外，如何传其他参数？
来包小而香
04-02 1317
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录前言一、问题1.方法一2.方法二 前言 elementUI调用组件方法除自带参数外，如何传其他参数？如Input Events 的change事件 一、问题 elementUI调用组件方法除自带参数外，如何传其他参数？ 如果需要再传入一个自定义参数，该怎么做呢？ 1.方法一 使用$event作为element UI方法的实参，然后是自定义参数的实参 @change="selectChange($event, 'edit')".
vue+element UI带输入建议的输入框el-autocomplete
云中客的博客
12-06 1万+
     之前做的项目中使用了element的选择器，然而由于选项太多不好找就更换为带输入建议的输入框 但我们接口要求并非是传入公司名称，而是传入这个注册公司的id，后端传入的数据结构经过转换后大致是这样的： companyList = [ { company_id: 1, comopany_name: '腾讯' }, { company_id: 2, comopany_...
解决element UI 自定义传参的问题
10-18
本文主要探讨如何解决Element UI组件自定义传参的问题，通过具体实例进行详细解析。 首先，以`el-autocomplete`组件为例，这个组件在用户选择建议项时，默认会将选中的数据作为`@select`事件的参数传递。如果在一个...
vue2.0_解决element-ui或vant-ui组件内置方法传参问题
QiuRenBB的博客
04-28 1442
前言   相信很多人都有遇到过这种问题，不管是element-ui组件库还是vant-ui组件库，其中很多组件都有自己的调用方法。并且，这些方法中都有自带参数，而我们在某些情况下调用组件的这些方法的同时，可能需要传一些自定义的参数，这时候如果我们直接传，就会有冲突。 以vant-ui中气泡弹出框为例 我往select方法传参数1111 <van-popover v-model="popoverVal" trigger="click" :actions="actions" @se
关于element组件事件如何自定义传参
qq_51558433的博客
06-12 1128
假设有下图这个场景，el-picker这个组件有个chang事件，它的形参已经是固定的了，那么我们如何加上自己想要的形参呢,直接加？那么原来的形参就会被替换，我以前的思路是，在标签中加一个data-xx然后在拿到该标签的实例，从而获取data-xx的内容，虽然可以实现目的，但是也忒麻烦了吧······ 船新版本，当当当当~~ 解释一下 @change后面跟的是个函数体，当触发这个事件的时候，就会调用自定义的函数,val是chang事件的形参，这时候我们就可以将原来的形参和自定义的形参一起传进去了，这个果然妙
elementui ＜el-autocomplete＞ querySearchAsync 搜索手机号码,补全信息
qq_41737172的博客
08-05 543
elementui querySearchAsync 搜索手机号码,补全信息
inputsearch:关于element UI 的input搜索下拉框的两种匹配方式
05-14
inputsearch input search function querySearch(queryString, cb) { var restaurants = this.restaurants; var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants; // 调用 callback 返回建议列表的数据 cb(results); }, createFilter(queryString) { return (restaurant) => { return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase())
vue 使用 element-ui 的 el-autocomplete 组件自定义内容 实现输入框自动提示查 加实时请求。
weixin_43138882的博客
10-12 3539
vue 使用 element-ui 的 el-autocomplete 组件自定义内容 实现输入框自动提示查 加实时请求。 输入的’测试’后台没有相应数据。 1 html里 <el-autocomplete v-model=“state1” popper-class=“my-autocomplete” :fetch-suggestions=“querySearch” placeholder=“请输入内容” @select=“handleSelect” > {{ item.nickname }
elementui带输入建议查询_elementUi简单实现搜索提词功能
weixin_29453497的博客
01-07 746
上周又又又又加需求了，好吧，bring it on先讲需求目标要实现功能focus的时候要出历史搜索(要存缓存)历史搜索下部出现清除缓存按钮input的时候要根据后台返回出提词elementui中比较能用的上就是 el-autocomplete 这个组件，但是呢，组件中要添加清除按钮，这个是比较麻烦的。因为，el-autocomplete 这个东西的slot是写弹框的每一项，而不是弹框整体，所以，...
Input输入框
qq_37881565的博客
08-26 1万+
Input输入框 通过鼠标和键盘输入字符。 Input为受控组件，它总会显示Vue绑定值。 通常情况下，应当处理input事件，并更新组件的绑定值（或使用v-model）。否则，输入框内显示的值将不会改变。 不支持v-model修饰符。 基础用法 <el-input v-model="input" placeholder="请输入内容"></el-input> <script> export default{ data(){ retu
element-ui带输入建议的input框踩坑(输入建议空白以及会闪出上一次的输入建议问题)
wyhstars的博客
08-14 4万+
前段时间，在实现带输入建议并且支持模糊查询输入框的时候，发现了两个值得注意的小地方。整理出来，以供借鉴。 废话不多说，直接来解决问题。 踩坑问题描述： 问题一： 获取到后端返回的数组，并将数组传入作为 results 传入 callback 后，焦点放在 输入框 上的时候，并未出现任何内容，只出现了一个不完整的空白框。 问题解决方案： 这个问题开始我以为是传进 ...
element-UI 事件添加额外自定义参数
无需有太多~
06-28 2万+
aass &lt;!-- 明细列表 --&gt; &lt;el-table :data="midSubmitDetailTableData" border stripe style="width: 100%"&gt;     &lt;el-table-column prop="submitAmount" label="本次交工数量"&gt;&lt;/el-table-c
在elementUI中使用 el-autocomplete 实现远程搜索的下拉框
热门推荐
huyao的博客
10-31 7万+
在template中添加标签   &lt;el-autocomplete v-model="detail.CUSTOMER_NAME" :fetch-suggestions="querySearchAsync" @select="handleSelect" placeholder="请输入内容" &gt; &lt;/el-autocomplete&gt;   在
vueui框架之elementUI--input输入框的属性 :fetch-suggestions="querySearchAsync"
huangyangquan3的博客
11-30 1万+
起因是这样的，最近在使用vue+elementUi在模仿某些网站的页面。因为之前不经常使用UI框架去写页面，所以对一些东西比较好奇，所以想要看看是怎么回事。 然后在编写一个输入框的时候，主要需求是这样的： 一个输入框，输入框聚焦和有内容输入的时候，在输入框有个弹出列 那么，我找了elementUI上的这个输入框组件：如下图 组件对应的代码如下： <el-autocomplete v...
vue+Element实现搜索功能关键字高亮（Vue开发五）
face light~
10-09 1万+
最近做了一个日志搜索的需求，要在页面上实现海量日志的关键字搜索。为了搜索更清晰，我最终实现了多条件搜索，且搜索结果的记录中的关键字全部高亮。 一、实现思路 实时监控表格，实现关键字的定位；点击搜索按钮以后，实现记录中关键字的样式变化（即高亮）。 二、实现过程 1 搜索条件表单 &amp;amp;lt;el-form :inline=&amp;quot;true&amp;quot; :model=&amp;quot;formQuery&amp;quot; &am
element ui 自定义字体
最新发布
06-06
要在 Element UI 中使用自定义字体，可以按照以下步骤操作： 1. 在 CSS 文件中定义自定义字体，例如： ``` @font-face { font-family: "MyFont"; src: url("myfont.woff2") format("woff2"), url("myfont.woff") format("woff"); } ``` 2. 在 Element UI 的主题文件中，添加对自定义字体的引用，例如： ``` $--font-family: "MyFont", sans-serif; ``` 3. 在组件中使用自定义字体，例如： ``` <el-button class="my-button">My Button</el-button> ``` ``` .my-button { font-family: "MyFont", sans-serif; } ``` 以上是在 Element UI 中使用自定义字体的基本步骤，具体实现细节可能会因为不同的项目和需求而有所差异。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值