antdesign vue 组件 表格带斑马纹实现

最终效果:
image.png

代码:

  updated(){
    // 表格斑马行显示
    this.renderStripe()
  },
  methods: {
        // 表格斑马行显示
      renderStripe(){
          const table=document.getElementsByClassName('ant-table-row')
          if(table.length>0){
              const rowList=[...table]
              rowList.map((row,index)=>{
                  if(index%2 !== 0) {
                      row.style.backgroundColor = '#f9f9f9'
                  } else {
                      row.style.backgroundColor = '#ffffff'
                  }
              })
          }
      },
  }
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容