vue进页面input自动获取焦点

时间:2020-11-05 15:13:18   收藏:0   阅读:300

1.ref实现,要写在mounted里面

<input type="text" v-model="name" ref="getFocus" />

<script>
export default {
  data() {
    return {
      name: ‘‘
    }
  },
  mounted() {
    this.$refs.getFocus.focus()
  }
}
</script>

2.使用自定义指令

Vue.directive(‘getFocus‘, {
    inserted: function(el, binding) {
        el.focus()
    }
})

<input type="text" v-model="name" v-getFocus />

3.使用原生js

<input type="text" v-model="name" id="getFocus" />

<script>
export default {
  data() {
    return {
      name: ‘‘
    }
  },
  mounted() {
      document.getElementById(‘getFocus‘).focus()
  }
}
</script>

 

原文:https://www.cnblogs.com/wu-hen/p/13931492.html

评论(0
© 2014 bubuko.com 版权所有 - 联系我们:wmxa8@hotmail.com
打开技术之扣,分享程序人生!