首页 > 其他 > 详细

vue进页面input自动获取焦点

时间:2020-11-05 15:13:18      阅读:298      评论:0      收藏:0      [点我收藏+]

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>

 

vue进页面input自动获取焦点

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

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!