Elementui 使用总结

1. 移动端文字提示框，因为移动端没有鼠标，故通过点击事件触发，从而选择el-popover组件：
   （1）v-show可以控制什么时候显示触发的元素；
   （2）visible-arrow控制提示框的小三角是否显示；
   （3）带有 slot=“reference” 的元素触发提示框；没有的表示提示框内文字描述。

<el-popover v-show="show" popper-class="class" :visible-arrow="false" placement="bottom-start" trigger="click">
   <div slot="reference" class="popoverDiv">                          
      <img v-if = "flag<0" class="" src="" alt="">
   </div>
    <div>此处填写提示的文字内容</div>
</el-popover>

2. 替换input中的放大镜图标：

.el-icon-search{
    background: url('') center center no-repeat;
    background-size: 20px;
  }
  .el-icon-search:before {
    visibility: hidden;
  }

3.el-table设置某一行的样式:添加边框，设置背景色
(1)html:

<el-table ref="saleTable" 
         :data="currList" 
         style="width: 100%" 
         height="calc(100% - 50px)" 
         :row-class-name="tableRowClassName">
</el-table>        

(2)methods:

      tableRowClassName({row}) {
        if (row.isSpec==1) {
          return 'specRow';
        }
        return '';
      }

(3)css

    .specRow{        
       td{
         border-top: 6px solid #FF7875;
         border-bottom: 6px solid #FF7875;
         background-color: #FF4E50;
         box-shadow: 6px 0 6px #5D0101;
       }
       td:first-child{
         border-left: 6px solid #FF7875;
       }
       td:last-child{
         border-right: 6px solid #FF7875;
       }
       .cell{
         color: #FFF;
       }
     }
     tr.specRow:hover td{
       background-color: #FF4E50 !important;
     }
     .el-table_1_column_1{
       overflow: hidden;
     }

4. 设置自定义提示框时间：duration

this.$message.success({message:"保存成功", duration: 1000});

5. 跳转到某一个页面:

this.$router.push({path: `/url`})

6. 更新中。。。。