Vue 如何触发键盘enter事件

在这里插入图片描述
写法:如果是input组件 则写法为@keyup.enter.native=“自定义事件” 如果是原生html的input标签 则不需要加.native
下面案例用的是一个组件

<Input v-model="form.checkCode" placeholder="请输入校验码" @keyup.enter.native="searchAllCompany">
     <span slot="append">
          {{ code }}
     </span>
</Input>

methods:{
	searchAllCompany(){
      console.log(123)
      this.handleSubmit()
    },
    handleSubmit() {
      
          //接口调试
          this.$axios
            .post("/api/sysAdmin/login/login", {
              loginName: this.form.userName,
              pwd: this.form.password,
            })
            .then((res) => {
              console.log(res);
              if (res.status === 200) {
                console.log("登录信息:", res);
                var data = JSON.parse(res.data.data.session_role);
                console.log(res.data.data.session_key);
                this.$store.commit("getToken", res.data.data.session_key);
                console.log(localStorage.getItem("token"));
                this.$store.commit(
                  "getUserInfo",
                  JSON.stringify(data.userInfo)
                );
                this.$router.push({
                  path: "home",
                  name: "home",
                });
                this.$Message.success("登录成功");
              } else {
                this.$Message.warning("登录失败");
              }
            });
    },
}

这样就能在输入验证码后直接触发enter事件了

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值