vue怎么在一个页面里写两个表格_vue项目中将element-ui table表格写成组件

表格中我们经常需要动态加载数据， 如果有多个页面都需要用到表格， 那我希望可以有个组件， 只传数据过去显示， 不用每个页面都去写这么一段内容：

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15 查看

16 编辑

17

18

19

上面这段代码是一个element-ui中tabele表格的形式，这里表头都是已经固定的， 如果每个页面都写上这么一段， 不同的是表头名字和字段，这样子就有点重复，而且页面的篇幅也就比较大了，于是把这块写成一个组件， 每个页面引入这个组件， 再传入数据。

1.  表格组件：

首先  table.vue 组件可以这样写：

1

2 v-loading="loading"

3 element-loading-text="拼命加载中"

4 element-loading-spinner="el-icon-loading"

5 element-loading-background="rgba(0, 0, 0, 0.3)">

6

7

9

10 :key="key"

11 :prop="th.prop"

12 :label="th.label"

13 :fixed="th.fixed"

14 :min-width="th.minWidth"align="center">

15

16

17

18 {{o.name}}

19