ant design vue中 table 带斑马纹表格

最新推荐文章于 2024-07-22 16:40:01 发布

huanghuzjjsj

最新推荐文章于 2024-07-22 16:40:01 发布

阅读量487

点赞数

分类专栏：前端功能点实现文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/huanghuzjjsj/article/details/129290288

版权

前端功能点实现专栏收录该内容

6 篇文章 0 订阅

订阅专栏

该代码段定义了一个名为`renderStripe`的函数，用于给具有类名ant-table-row的表格行交替设置背景色。当行索引为偶数时，背景色设为白色，否则设为淡灰色，从而实现类似斑马纹的显示效果，提高表格可读性。

摘要由CSDN通过智能技术生成

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 = 'rgb(255,255,255)';
          } else {
            row.style.backgroundColor = "#f9f9f9";
          }
        });
      }
    }