vue 回车键输入框获取焦点自定义指令

直接在main.js挂载.组件用v-enterDownNext 贼好用

Vue.directive('enterDownNext', {
  inserted: function (el) {
    let inputs = el.querySelectorAll('input')
    // 绑定回写事件
    for (var i = 0; i < inputs.length; i++) {`在这里插入代码片`
      inputs[i].setAttribute('keyFocusIndex', i)
      inputs[i].addEventListener('keydown', (ev) => {
        if (ev.keyCode === 13) {
          let targetTo = ev.srcElement.getAttribute('keyFocusTo')
          if (targetTo) {
            this.$refs[targetTo].$el.focus()
          } else {
            var attrIndex = ev.srcElement.getAttribute('keyFocusIndex')
            var ctlI = parseInt(attrIndex)
            // console.log(ctlI)
            if (ctlI < inputs.length - 1) {
              setTimeout(() => {
                inputs[ctlI + 1].focus()
              },500)
            }
          }
        }
      })
    }
  }
})

最后

以上就是活泼高跟鞋最近收集整理的关于vue 回车键输入框获取焦点自定义指令的全部内容，更多相关vue内容请搜索靠谱客的其他文章。