美文网首页
vue 回车事件刷新页面

vue 回车事件刷新页面

作者: 卓小生 | 来源:发表于2018-07-06 14:32 被阅读0次

    element-ui

    解决办法

    el-form标签添加 @submit.native.prevent

    • 栗子
    <el-form @submit.native.prevent>
      <el-input placeholder="请输入标题/工单号" v-model="search" size="medium" @keyup.enter.native="onSubmit"></el-input>
    </el-form>ou
    

    form

    解决办法

    这样出现的问题是,按下回车后会刷新页面,原因是按回车后默认提交了表单, 一个表单下,如果只有一个文本框时,按下回车将会触发表单的提交事件。
    • 栗子
    加一个隐藏的文本框
    <form action="#">
      <input type="search" placeholder="搜索商品" class="search_input" v-model="keyword" @keyup.enter="doSearch">
      <input type="text" style="display:none" />
    </form>
    

    相关文章

      网友评论

          本文标题:vue 回车事件刷新页面

          本文链接:https://www.haomeiwen.com/subject/bykvuftx.html