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();

vue、element-ui开发技巧的更多相关文章

  1. Vue + Element UI 实现权限管理系统

    Vue + Element UI 实现权限管理系统 前端篇(一):搭建开发环境 https://www.cnblogs.com/xifengxiaoma/p/9533018.html

  2. 基于vue(element ui) + ssm + shiro 的权限框架

    zhcc 基于vue(element ui) + ssm + shiro 的权限框架 引言 心声 现在的Java世界,各种资源很丰富,不得不说,从分布式,服务化,orm,再到前端控制,权限等等玲琅满目 ...

  3. 分享一个自搭的框架,使用Spring boot+Vue+Element UI

    废弃,新的:https://www.cnblogs.com/hackyo/p/10453243.html 特点:前后端分离,可遵循restful 框架:后端使用Spring boot,整合了aop.a ...

  4. vue + element ui 实现实现动态渲染表格

    前言:之前需要做一个页面,能够通过表名动态渲染出不同的表格,这里记录一下.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9786326.html 网站地址:我的 ...

  5. vue + element ui 表格自定义表头,提供线上demo

    前言:工作中用到 vue+element ui 的前端框架,需要使用自定义表头,需要使用 re.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9710826.h ...

  6. vue+element ui 的上传文件使用组件

    前言:工作中用到 vue+element ui 的前端框架,使用到上传文件,则想着封装为组件,达到复用,可扩展.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9 ...

  7. vue+element ui 的表格列使用组件

    前言:工作中用到 vue+element ui 的前端框架,有这个场景:很多表格的列有许多一样的,所以考虑将列封装为组件.转载请注明出处:https://www.cnblogs.com/yuxiaol ...

  8. vue+element ui 的tab 动态增减,切换时提示用户是否切换

    前言:工作中用到 vue+element ui 的前端框架,动态添加 Tab,删除 Tab,切换 Tab 时提示用户是否切换等,发现 element ui  有一个 bug,这里记录一下如何实现.转载 ...

  9. 基于 vue+element ui 的cdn网站(多页面,都是各种demo)

    前言:这个网站持续更新中...,有网上预览,github上也有源码,喜欢记得star哦,欢迎留言讨论. 网站地址:我的个人vue+element ui demo网站 github地址:yuleGH g ...

  10. vue + element ui 阻止表单输入框回车刷新页面

    问题 在 vue+element ui 中只有一个输入框(el-input)的情况下,回车会提交表单. 解决方案 在 el-form 上加上 @submit.native.prevent 这个则会阻止 ...

随机推荐

  1. 单片机成长之路(51基础篇) - 026 基于stm89c52之单片机看门狗

    基于stc89c52的看门狗,代码如下: main.c #include "stc89c5x_Quick_configuration.h" // 自定义头文件 #include & ...

  2. C# 调用TRIO控制器ActiveX教程

    最近项目由于用到上位机与TRIO交互,为了使交互编程方便,使用了TRIO的COM组件.记录一下为方便以后自己使用,同时也方便大家做参考! 组件下载地址(百度云盘):https://pan.baidu. ...

  3. python 多进程并发demo

    outline 下午需要简单处理一份数据,就直接随手写脚本处理了,但发现效率太低,速度太慢,就改成多进程了: 程序涉及计算.文件读写,鉴于计算内容挺多的,就用多进程了(计算密集). 代码 import ...

  4. @Async源码探究

    1. @Async源码探究 1.1. 上代码 @SpringBootApplication @EnableAsync public class SpringbootLearnApplication { ...

  5. MySQL修炼之路一

    1. MySQL概述 1. 什么是数据库 存储数据的仓库 2. 都有哪些公司在用数据库 金融机构.游戏网站.购物网站.论坛网站 ... ... 3. 提供数据库服务的软件 1. 软件分类 MySQL. ...

  6. Visual Studio调试到OpenCV源码中

    TL;DR VS2015下,build-farm/vs2015-x64/bin/Debug/目录,*.pdb文件,都拷贝到install/x64/vc14/bin目录,就可以调试进去opencv源码了 ...

  7. 创建readonly只读用户脚本

    身为一名运维工作人员,保证服务器的安全是必要项,当开发人员或测试人员需登录到服务器查看日志等操作时,可只给定特定的权限防止误操作的惨况产生. 以下脚本内容均为我本人环境,如有更改可自行修改. ~]# ...

  8. javascript之BOM对象(三其他对象)

    一.navigator对象 navigator使用来识别浏览器的,是所有支持javascript的浏览器所共有的.与BOM的其他对象不同,每个浏览器的navigator对象都有一套自己的属性. 常见的 ...

  9. Removing Stones(2019年牛客多校第三场G+启发式分治)

    目录 题目链接 题意 思路 代码 题目链接 传送门 题意 初始时有\(n\)堆石子,每堆石子的石子个数为\(a_i\),然后进行游戏. 游戏规则为你可以选择任意两堆石子,然后从这两堆中移除一个石子,最 ...

  10. LeetCode 1094. Car Pooling

    原题链接在这里:https://leetcode.com/problems/car-pooling/ 题目: You are driving a vehicle that has capacity e ...