vueelement-ui开发技巧

Posted 2021-03-25 linjie1930906722

1、vue下input文本框获得光标

html：

<el-input size="mini" clearable v-model.trim="addOrEditData.gridCode" ref="inputGridCode" ></el-input>

js（在需要触发获取input光标方法加入下面js，如果需要再进入页面获得就获得光标则在vue钩子函数mounted加上下面代码：）:

 this.$refs.inputGridCode.focus();

2、vue中input文本框内容选中

方法一：

html：

<el-input size="mini" clearable v-model.trim="addOrEditData.gridCode" ref="inputGridCode"  @@focus="inputFocus($event)"></el-input>

js方法：

inputFocus(event) {
                    event.currentTarget.select();
                }

方法二：

html：

<el-input size="mini" clearable v-model.trim="addOrEditData.gridCode" ref="inputGridCode" ></el-input>

js:

this.$refs.inputGridCode.select();