vue2中为eltable表里每个单元格都添加阴影怎么做

你可以通过自定义 `el-table` 的 `cell-class-name` 属性来为每个单元格添加阴影。具体的做法如下：

1. 在 `el-table` 组件上添加 `cell-class-name` 属性，并将其值设置为一个方法。

<el-table :data="tableData" :cell-class-name="tableCellClassName">
  <!-- 表格内容 -->
</el-table>

2. 在组件的 `methods` 中定义 `tableCellClassName` 方法，该方法接收一个参数 `row`，代表当前行的数据对象。

methods: {
  tableCellClassName(row, column, rowIndex, columnIndex) {
    // 返回一个包含 CSS 类名的字符串，用于为单元格添加样式
    return 'cell-shadow';
  }
}

在 `tableCellClassName` 方法中，你可以根据不同的条件为单元格添加不同的 CSS 样式。在这个例子中，我们只需要返回一个包含 `cell-shadow` 类名的字符串，然后在 CSS 样式中定义 `cell-shadow` 类名的样式即可：

.cell-shadow {
  box-shadow: 1px 1px 5px #ccc;
}

这样，每个单元格就都会有一个阴影效果了。你可以根据实际需求修改阴影的样式和颜色。

相关问题

vue2 eltable个单元格添加阴影

要给vue2的el-table中的单元格添加阴影，可以通过CSS样式来实现。可以在样式文件中添加以下代码：

.el-table__row td {
  box-shadow: 2px 2px 3px #ccc; /* 设置单元格阴影 */
}

其中，`.el-table__row td`表示表格中的单元格，`box-shadow`属性用于设置阴影效果，依次为水平方向偏移量、垂直方向偏移量、模糊半径和阴影颜色。将上述代码中的阴影效果值修改为你想要的样式即可。

vue2为eltable添加loading

要为 `el-table` 添加 loading 效果，可以使用 `el-table` 的 `loading` 属性。该属性可以接受一个布尔值或一个对象。如果是布尔值为 `true`，则会在 `el-table` 上显示一个默认的 loading 效果。如果是一个对象，可以设置 loading 效果的样式、文字等信息。

以下是一个示例代码：

<template>
  <div>
    <el-table :data="tableData" :loading="tableLoading">
      <!-- 表格列项 -->
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [],
      tableLoading: false
    }
  },
  methods: {
    fetchData() {
      this.tableLoading = true
      // 异步请求数据
      // 请求完成后将 tableLoading 置为 false
    }
  }
}
</script>

在上面的代码中，通过 `:loading="tableLoading"` 将 `el-table` 的 loading 属性绑定到 `tableLoading` 变量上。在 `fetchData` 方法中，将 `tableLoading` 设置为 `true`，然后进行异步请求数据，在请求完成后将 `tableLoading` 置为 `false`，这样就能够在 `el-table` 上显示 loading 效果了。