vue登录界面获取input框焦点以及回车响应逻辑

// 回车键自动登录
    created: function() {
      const that = this
      document.onkeypress = function(e) {
        var keycode = document.all ? event.keyCode : e.which
        if (keycode === 13) {
          that.$refs.userInput.focus()      //用ref绑定input框 ,这里是用户名,进入页面敲击回车获得焦点
          if (that.loginForm.username) {          // 如果用户名input框有值,敲击回车下一个input框获取焦点,依次类推
            that.$refs.passwordInput.focus()
          }
          if (that.loginForm.password) {
            that.$refs.captchaInput.focus()
          }
         // 如果所有input框都有值,敲击回车触发登录事件
          if (that.loginForm.username && that.loginForm.password && that.loginForm.captcha) {
            that.handleLogin()
          }
        }
      }
    },

你可能感兴趣的:(vue登录界面获取input框焦点以及回车响应逻辑)