created(){
this.changfouce();
},
methods: {
//在vue生命周期的created()钩子函数进行的DOM操作要放在Vue.nextTick()的回调函数中,
//因为created()钩子函数执行的时候DOM并未进行任何渲染,而此时进行DOM操作是徒劳的,所以此处一定要将DOM操作的JS代码放进Vue.nextTick()的回调函数中。
changfouce(){
this.$nextTick((x)=>{ //正确写法
this.$refs.inputs.focus();
})
this.$refs.inputs.focus(); //错误写法 },

vue中让input框自动聚焦的更多相关文章

  1. 函数式组件中实现Antd打开Modal后其Input框自动聚焦(focus)到文字的最后

    目前React使用函数式组件已经成为趋势, 如何把React函数式组件用好, 提高性能, 从而实现业务需求也成为了一种能力的体现......咳咳咳, 进入正题: 现实场景需求 我想实现这一个需求, 父 ...

  2. vue中的input使用e.target.value赋值的问题

    很久不写博客了... vue中对表单的处理,相对原生js,增加了一个双向绑定的语法糖:v-model.官方文档里有一段: v-model 会忽略所有表单元素的 value.checked.select ...

  3. VUE DIV模拟input框的基本处理

    关键代码 <div class="dialog-main" :contenteditable= "editable" v-text="notic ...

  4. vue 中 限制 input 输入数字、小数位数等

    限制小数位数 <input type="number" @keydown="handleInput2" placeholder="请输入或查看& ...

  5. Vue中去除文本框回车默认事件

    使用v-on:keydown.enter.prevent即可 <input type="password" class="form-control" id ...

  6. Vue中-下拉框可以选择可以填写

    <el-form-item label="方法名称"> <el-autocomplete popper-class="my-autocomplete&q ...

  7. vue中的select框的值动态绑定

    <--这两种写法效果一样--> 1: <select v-model="wxStatus"> <option label="已添加" ...

  8. vue中的toast组件

    首先在components新建组件文件夹 随后在toast.vue中写入弹框样式 <template> <transition name="demo"> & ...

  9. input框只允许输入正整数、正数(包含小数)的解决方法 vue.js实现

    我来打自己脸了!!!!...刚刚发现在中文输入法下是无效的,有人能解决这个问题么 如果要求input只能输入数字怎么做? 设置type="number" ? 那我如果想限制长度,此 ...

随机推荐

  1. C# 根据类名创建类的实例对象

    因为我使用这个方法的类都是和AbstractScenePageDTO处于一个命名空间以及程序集下的,所以获取命名空间和程序集的时候,直接使用AbstractScenePageDTO这个类进行获取,这样 ...

  2. DownloadProvider源码解析——与Volley对比

    1.AndroidHttpClient的创建 DownloadManager: 在DownloadThread的run方法里 public void run() { Process.setThread ...

  3. Web 通信 之 长连接、长轮询(long polling)(转载)

    基于HTTP的长连接,是一种通过长轮询方式实现"服务器推"的技术,它弥补了HTTP简单的请求应答模式的不足,极大地增强了程序的实时性和交互性. 一.什么是长连接.长轮询? 用通俗易 ...

  4. day_10 py 字典

    #!/usr/bin/env/python#-*-coding:utf-8-*-'''字典: (就是增加个索引名字,然后归类了一下) infor = {键:值,键:值} 列表存储相同的信息随着列表里面 ...

  5. MyISAM和InnoDB区别 及选择

    MySQL默认采用的是MyISAM. MyISAM不支持事务,而InnoDB支持.InnoDB的AUTOCOMMIT默认是打开的,即每条SQL语句会默认被封装成一个事务,自动提交,这样会影响速度,所以 ...

  6. scala breeze使用替换底层线性库

    scala -J-Dcom.github.fommil.netlib.NativeSystemBLAS.natives=mkl_rt.dll -cp "D:\betn\Scala\Scala ...

  7. 使用python爬虫爬取股票数据

    前言: 编写一个爬虫脚本,用于爬取东方财富网的上海股票代码,并通过爬取百度股票的单个股票数据,将所有上海股票数据爬取下来并保存到本地文件中 系统环境: 64位win10系统,64位python3.6, ...

  8. HTTP Error 400. The request hostname is invalid

    HTTP Error 400. The request hostname is invalid 错误, 检查服务的iis服务得知,是因为在绑定主机和端口的那一步时也指定了相应的域名. 解决办法: 去掉 ...

  9. Entity Framework Core的坑:Skip/Take放在Select之前造成Include的实体全表查询

    今天将一个迁移至 ASP.NET Core 的项目放到一台 Linux 服务器上试运行.站点启动后,浏览器打开一个页面一直处于等待状态.接着奇怪的事情发生了,整个 Linux 服务器响应缓慢,ssh命 ...

  10. c语言笔记 数组2

    15. c99以前一直使用 gets 和 puts来输入输出字符串,但是gets因为无法获知内存大小,容易出现内存溢出(对此c99对gets,采取保留态势,c11直接废除,但是某些编译器仍然默认可以使 ...