各种百度各种查,查了一些资料,发现有用width的有自己写的,一大堆看不懂
最后用 af-table-column 解决
在el-table中使用
1)安装
npm install af-table-column
2)在main.js中引用
import Vue from 'vue' import ElementUI from 'element-ui' //需要按需引入,先引入vue并引入element-ui import AFTableColumn from 'af-table-column' Vue.use(AFTableColumn)
3)在el-table中使用
<template> <el-table :data="data"> <af-table-column label="列1" prop="field1"></af-table-column> <af-table-column label="列2" prop="field2"></af-table-column> <!--也支持简单的自定义内容--> <af-table-column label="列3"> <template slot-scope="scope"> <div>自定义显示值31: {{ scope.row.field31 }}</div> <div>自定义显示值32: {{ scope.row.field32 }}</div> </template> </af-table-column> //也支持element-ui原有的el-table-column <el-table-column label="操作"> <template slot-scope="scope"> <el-button @click="removeItem">删除</el-button> </template> </el-table-column > //af-table-column 和el-table-column 可以同时在一个表格中使用 </el-table> </template>
看前端面试题 大全 MST题库 小程序