Vue中想点击按钮聚焦怎么办?我们继续分享

当你的产品告诉你，给你个按钮，点击它给我弹出键盘，然后让输入框给我获取焦点。这时就需要今天我们分享的"小栗子"了，废话不多说，开整。

涉及内容Vue.js与自定义指令（directives）

html部分

<input type="text" @blur="focusState = false" v-focus="focusState"> 
<div @click="focusclick">按钮</div>

js部分

new Vue({
  el: '#app',
  data: {
    message: 'hello!',
    focusState: false
  },
  methods: {
    focusclick () {
      this.focusState = true  
    }
  },
  directives: {
    focus: {
      //根据focusState的状态改变是否聚焦focus
      update: function (el, {value}) {    //第二个参数传进来的是个json
        if (value) {
          el.focus()
        }
      }
    }
  }
})