vue.js + element中el-select实现拼音匹配,分词、缩写、多音字匹配能力
1、既然要用到拼音搜索,我们就需要一个拼音库,在这里我推荐一个第三方包:https://github.com/xmflswood/pinyin-match,在这里首先对这个包的开发者表示万分的感谢。
2.安装第三方包:
npm install pinyin-match --save
3.在index.html中引入
<script src="pinyin-match/dist/main.js"></script>
4.好了现在我们就能使用了,话不多说直接上代码,为select添加filter-method方法,这是html部分的
5.PinyinMatch()这个方法的具体内容
val使我们输入框的内容
copycommonAddr是我们对commonAddr的复制数据
这样我们就实现了打出拼音简码选项即可跳出的功能,效果如下图:
---------------------
作者:李少0
来源:CSDN
原文:https://blog.csdn.net/li00828/article/details/85089358
版权声明:本文为博主原创文章,转载请附上博文链接!
vue.js + element中el-select实现拼音匹配,分词、缩写、多音字匹配能力的更多相关文章
- 如何Vue-cli开始使用在Vue.js项目中启动TDD(测试驱动开发)
通常,使用测试驱动开发(TDD)最困难的部分是开始.你必须下载带有奇怪依赖项的软件包,让测试套件与你的构建系统协同工作,然后你必须弄清楚如何编写一个测试!难怪这么多的开发者在你提起它的时候就开始跑开了 ...
- 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题
方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...
- vue.js双向绑定之--select获取text
在大多数情况下select下拉菜单都是value和text设置不同的值的,value一般来说是与后台交互的值,而text是前端用来显示的文本: 但是,vue.js对到表单的双向绑定时如果option设 ...
- vue.js+element ui Table+spring boot增删改查
小白初学,不懂的还是太多了,找了好多资料才做出来的先记录一下 1.先用Spring boot创建一个包含了增删改查的项目 2.创建vue.js项目 3.安装Element UI (1)进入项目文件夹下 ...
- Vue.js 组件中data的使用
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue.js + element 搭建后台管理系统 笔记(一)
此文仅记录本人在搭建后台系统过程中遇到的难点及注意点,如果能帮到各位自然是极好的~~~ 项目主要架构:vueJS.elementUI.scss 一.项目初始化 首先需要安装nodejs,安装方法就不在 ...
- Vue.js + Element.ui 从搭建环境到打包部署
一.搭建环境 由于新的node已经集成了npm,所以直接安装node,前往node官网下载最新版本的node,根据自己的操作系统选择相应的包,按照步骤一步步走就可以,这里不做过多介绍. 安装好后可以打 ...
- vue.js 1中父组件跳到子组件中并传参让子组件显示不同的内容
父组件中的点击跳转: <ul class="insurance-entry clearfloat"> <li v-link="{name:'produc ...
- vue封装element中table组件
后台系统,table被用的次数比较多,所以决定提出来作为组件 1.新建一个Table.vue文件 <!--region 封装的分页 table--> <template> & ...
随机推荐
- 为什么要进行初始化(C语言)
答案:是为了清除被释放的内存中保存的以前程序中留下的垃圾数据.
- git需要设置再次弹出输入账号密码
今天在用命令行pull线上代码到本地时遇到一个尴尬的问题,因为新下载的git貌似默认了在pull,push代码时只弹出一次输入账号密码,反正我这里是这样的. 开始在pull线上代码的时候不小心密码输错 ...
- SpringBoot学习- 11、更好用的代码生成工具EasyCode
SpringBoot学习足迹 之前的mybatis代码生成工具无法自定义模板,找了一个可以自定义模板的插件,初学者最好用比较齐全的代码生成工具,不然拼错一个代码会掉坑里半天爬不出来. 有的同学会说干么 ...
- c# 使用T4模板生成实体类(sqlserver)
新建类库,右键添加 "文本模板" 添加完成之后生成如下后缀为 tt的文件: 双击文件:TextTemplate_Test.tt 文件打开,替换代码如下 <#@ templat ...
- 【spring boot】SpringBoot初学(7)– 多数据源及其事务
前言 github: https://github.com/vergilyn/SpringBootDemo 代码位置: 参考: Spring Boot Reference Guide , §77.2 ...
- 嵊州D5T2 折纸 folding
折纸 folding [问题描述] 在非常紧张的 NOIP 考试中,有人喜欢啃指甲,有人喜欢转铅笔,有人喜欢撕 纸条,……而小 x 喜欢迷折纸. 现有一个 W * H 的矩形纸张,监考老师想知道,小 ...
- 产生随机数(rand()函数和srand()函数)
有时候,我们需要随机产生一个在某范围的数,C/C++提供了一个库函数rand()来产生随机数. 函数原型:int rand(void); 功能:返回一个[0,RAND_MAX]间的随机整数.其中RAN ...
- fiddler使用post方法带参数(base64)请求接口,模拟表单提交,类似工具postman
头格式如下: Content-Length: Content-Type: multipart/form-data; boundary=-------------------------- Host: ...
- CF1237F Balanced Domino Placements
题意 给定一个 \(h\) 行 \(w\) 列的方格图,上面已经放置了一些 \(1\times 2\) 的多米诺骨牌. 我们称一个放置多米诺骨牌的方案是好的,当且仅当任何两个多米诺骨牌不占用相同的行与 ...
- 将Ubuntu软件更新的源,换城阿里源
阿里云镜像: https://developer.aliyun.com/mirror/ 简介 Ubuntu,是一款基于 Debian Linux 的以桌面应用为主的操作系统,内容涵盖文字处理.电子邮件 ...