zoukankan      html  css  js  c++  java
  • vue el-input使用回车键会刷新页面

    问题:vue项目中 在输入框输入字符并按下回车键搜索时,不会进行搜索, 而是会刷新页面。

    后来发现 只有页面中只有一个input时 才会出现此问题,经查阅得知,是因为当form表单中只有一个input时,按下回车建会自动触发页面的提交功能, 所以会产生刷新页面的行为

    解决方法

    el-form中加入 

    <el-form :inline="true" label-suffix=":" @submit.native.prevent>
          <el-form-item label="用户名">
            <el-input v-model.trim="queryData.username" @keydown.enter.native="fetchData" clearable placeholder="请输入用户名"/>
          </el-form-item>
            ......
    </el-form>

    @submit: 表单提交
    .native 绑定系统原生事件
    .prevent 提交以后不刷新页面

  • 相关阅读:
    lighting
    移动端
    SVN常见问题
    前四章知识点小结
    如何不运用第三方变量实现两个数的交换
    awk
    sort
    cut
    sed
    30道Linux面试题
  • 原文地址:https://www.cnblogs.com/lyh233/p/15146806.html
Copyright © 2011-2022 走看看