vue:element-ui输入框绑定回车事件
参考:
https://segmentfault.com/q/1010000011347642
vue监听input输入框的回车事件:keyup
事件,加enter
修饰符。如果input
是组件,加上.native
修饰符。
例如:
@keyup.enter="方法名"
<div id="app"> <input placeholder="请输入账号" type="text"> <input placeholder="请输入密码" type="password" @keyup.enter="login"> <button @click="login">登录</button> <div> <script> new Vue({ methods: { login() { console.log('哎呀,登录中...'); } } }).$mount('#app') </script>
在element-ui中:el-input
绑定了 @keyup.enter.native
事件
@keyup.enter.native="方法名"
注意:
当一个
form
元素中只有一个输入框
时,在该输入框中按下回车会提交该表单。如果希望阻止这一默认行为,可以在标签上添加 @submit.native.prevent
。<el-form @submit.native.prevent> ..... </el-form>
或者为表单元素增加属性 onSubmit="return false"
。