[element-ui] el-table 行与行之间设置间隔, 行内的渐变效果

设置行与行之间的间距

::v-deep .el-table__body{
  //-webkit-border-horizontal-spacing: 13px;  // 水平间距
  -webkit-border-vertical-spacing: 13px;  // 垂直间距
}

设置行内颜色渐变，并实现隔行颜色不一样

// 设置隔行变色
    tableRowClassName({ rowIndex}) {
      if (rowIndex % 2 === 0) {
        return 'yellow'
      } else {
        return 'orange'
      }
    },

::v-deep .yellow
  background: linear-gradient(90deg,rgba(31,94,167,0.00) 3%, rgba(31,94,167,0.40) 40%, rgba(31,94,167,0.40) 70%, rgba(31,94,167,0.00) 100%) !important;
}
::v-deep .orange
  background: linear-gradient(90deg,rgba(31,94,167,0.00) 3%, rgba(31,94,167,0.20) 50%, rgba(31,94,167,0.20) 70%, rgba(31,94,167,0.00) 100%) !important;
}

参考：

实现element table组件内行与行之间设置间隙效果以及行内的渐变效果以及各种问题