vue 给页面添加enter回车事件 - 代码篇
vue 如何给页面添加enter回车事件?主要代码:@keyup.enter.native="ajaxLoginApi()"代码示例:<el-form ref="form" :model="form" :label-position="labelPos
·
vue 如何给页面添加enter回车事件?
主要代码:
@keyup.enter.native="ajaxLoginApi()"
代码示例:
<el-form ref="form" :model="form" :label-position="labelPosition" label-suffix=":" label-width="100px" status-icon>
<el-form-item label="手机号码">
<el-input v-model="form.username" size="mini" @keyup.enter.native="ajaxLoginApi()"></el-input>
</el-form-item>
<div class="tips"></div>
<el-form-item label="密码">
<el-input type="password" v-model="form.pwd" size="mini" clearable @keyup.enter.native="ajaxLoginApi()"></el-input>
</el-form-item>
<div class="tips"></div>
<div class="tips"></div>
<div style="margin-top: 10px;margin-left:0">
<el-button type="primary" @click="ajaxLoginApi" size="medium">确认登录</el-button>
<el-button type="" plain size="medium" @click="linkTo('#/register')">立即注册</el-button>
</div>
</el-form>
效果图截图:
除了按钮提交,还能在表单校验无误之后,键盘enter回车提交!
以上就是关于 ” vue 给页面添加enter回车事件 - 代码篇 “ 的全部内容。
更多推荐
已为社区贡献51条内容
所有评论(0)