欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

ElementUI input输入框实现选择部分内容

程序员文章站 2022-03-22 09:51:35
项目中有个文档管理模块,重命名功能是需要选中文件名,文件后缀不能被选中。ElementUI有提供全选的方法,如果选择所有内容可直接使用该方法。如图:如果要实现选择部分内容就不能直接使用该方法。实际input给我们提供了selectionStart,selectionEnd两个属性表示选择内容的起始位置。还有一个问题就是ElementUI提供给我们的输入框实际结构是这样的这样下来问题就简单了。上代码:```javascript// Name表示文件全名(包括后缀名),Suffix代表后缀名l...

项目中有个文档管理模块,重命名功能是需要选中文件名,文件后缀不能被选中

ElementUI有提供全选的方法,如果选择所有内容可直接使用该方法。如图:
ElementUI input输入框实现选择部分内容
如果要实现选择部分内容就不能直接使用该方法。实际input给我们提供了selectionStart,selectionEnd两个属性表示选择内容的起始位置。还有一个问题就是ElementUI提供给我们的输入框实际结构是这样的
ElementUI input输入框实现选择部分内容
这样下来问题就简单了。上代码


// Name表示文件全名(包括后缀名),Suffix代表后缀名
let el = this.$refs.editInput.$el.children[0]; // 获取到input对象
el.select() // 选择
el.selectionEnd = row.Name.indexOf(row.Suffix);// 选择末尾位置

本文地址:https://blog.csdn.net/weixin_45016896/article/details/111880858

相关标签: vue.js elementui