通过使用enter键模拟点击确定按钮

2019独角兽企业重金招聘Python工程师标准>>>

使用enter键模拟点击确定按钮

       方法是绑定事件 @keyup.enter.native="submitForm()"

<el-dialog

  ref="dialog"

  :visible.sync="show"

  :append-to-body="true"

  :close-on-click-modal="false"

  :close-on-press-escape="false"

  :show-close="false"

  :fullscreen.sync="fullscreen"

  @keyup.enter.native="submitForm()">
</el-dialog>

知识点：

vue运行为v-on在监听键盘事件时，添加了特殊的键盘修饰符：<input v-on:keyup.13="submit">。vue还给出了常用按键的别名，这样就不必去记keyCode 如：

<input v-on:keyup.enter="submit">

<input @keyup.enter="submit">

但如果用了封装组件的话，比如element-ui，这个时候使用按键修饰符需要加上.native 比如：

<el-input v-model="account" placeholder="请输入账号" @keyup.enter.native="search()"></el-input>

一些键盘名称：.enter  .tab  .delete (捕获 “删除” 和 “退格” 键)  .esc  .space  .up  .down .left  .right   .ctrl  .alt   .shift  .meta(window系统下是window键，mac下是command键)

或是还可以用一些组合键：

    Alt + C :<input @keyup.alt.67="doSth">

   Ctrl + Click :<div @click.ctrl="doSth">点我</div>

 

 

转载于:https://my.oschina.net/u/3759656/blog/2933803