组件
名称小写==》 用-链接
02===>
属性==> empty-text="暂无数据" 当表格中没有数据 就会显示 暂无数据
<el-table-column
v-for="item in tabColumn"
:key="item.prop"
:prop="item.prop"
:label="item.label"
:width="item.width"
:align="item.align"
empty-text="暂无数据"
>
</el-table-column>
03==> :align="item.align" 是居中的方式 有 left center right
组件.vue
<template>
<el-table :data="tableData" stripe style="width: 100%">
<el-table-column
v-
empty-text="暂无数据"
></el-table-column>
</el-table>
</template>
<script>
export default {
props: {
// 传递过来的值
tableData: {
type: Array,数组类型
required: true 必须值
},1)"> 字段样式的数组
tabColumn: {
type: Array,required: true
}
},data() {
return {};
}
};
</script>
使用组件的页面(父)
<template>
<div>
<mytab :tableData="tableData" :tabColumn="tabColumn"></mytab>
</div>
</template>
<script>
import mytab from "../../../components/my-tab";
export {
data() {
{
表格数据
tableData: [
{
date: "2016-05-02",name: "王小虎" 字段数组
tabColumn: [{
prop: 'date''180''name''center''地址''电话'
原文地址:https://www.cnblogs.com/IwishIcould
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。