vue中让input框自动聚焦

Posted huanhuan55

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue中让input框自动聚焦相关的知识,希望对你有一定的参考价值。

  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框自动聚焦的主要内容,如果未能解决你的问题,请参考以下文章

vue中,点击button按钮后,页面上的input框自动聚焦

vue实现点击button按钮,input输入框自动聚焦,带微信原生做法

vue input 输入框聚焦

Vue - 实现双击显示编辑框;自动聚焦点击的显示框;点击编辑框外的地方,隐藏编辑框

js元素聚焦(vue)

Vue 回顾之指令(关于input自动聚焦的问题)