elementui 问题记录

2019-05-10  本文已影响0人  一叶知秋_038b

1.项目风格为了统一 将confirm框 统一换成elementui的
官网例子: 使用没有任何难度 和诸多confirm框参数 格式基本相同

<template>
  <el-button type="text" @click="open">点击打开 Message Box</el-button>
</template>

<script>
  export default {
    methods: {
      open() {
        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });          
        });
      }
    }
  }
</script>

但是更换到项目上时 出现了一个问题 那就是每次新进入页面时 confirm会闪退一次 接着点击的话 就一直正常了 最后发现问题在于 <a>标签 因为这个<a>标签使用的空链接 <a href=‘#’> 导致 组件每次第一点击都会刷新掉 解决办法 直接删除href="#"即可

附代 a标签几种常用空链接方式
1、 <a herf=""></a>
这种方法会默认打开本页面,重新刷新一次页面。
2、<a herf="#"></a>
这种方法会在地址栏的后面添加一个#号,然后回到页面顶部。
3、<a herf="###"></a>
这种方法可以再chrome和ie11中,不再跳回页面顶部,但是还是会修改地址栏。
4、使用javascript伪协议

上一篇 下一篇

猜你喜欢

热点阅读