el-table 鼠标移入显示移出隐藏滚动条


话不多说,上代码

<el-table
     :data="propertyData"
     style="width: 100%"
     max-height="400px"
     :class="[isDologin ? 'scrollbarShow' : 'commonScrollbarTable']"
     @cell-mouse-enter="enter"
     @cell-mouse-leave="leave">
          <el-table-column label="名称" align="center" prop="assetsName" />
          <el-table-column label="品牌" align="center" prop="assetsBrand" />
          <el-table-column label="型号" align="center" prop="assetsModel" />
          <el-table-column label="数量" align="center" prop="number" />
</el-table> 
data(){
    return{
      propertyData:[],
      isDologin: false
    }
},
methods: {
     enter() {
      this.isDologin = true;
     },
     leave() {
      this.isDologin = false;
     }
}
/*滚动条的宽度*/
.commonScrollbarTable ::v-deep .el-table__body-wrapper::-webkit-scrollbar {
  display: none;
}
.scrollbarShow ::v-deep .el-table__body-wrapper::-webkit-scrollbar {
  display: block;
}

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM