在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ element中的表格字段是寫死的,如何靈活的傳進(jìn)指定字段

element中的表格字段是寫死的,如何靈活的傳進(jìn)指定字段

element中的表格字段是寫死的,如何靈活的傳進(jìn)指定字段?比如我知道后端會(huì)返回一些key和valu值,我想直接替換label和Prop中的字段。我用了v-for便利了prop綁定的字段,發(fā)現(xiàn)這么做行不通。

<template>
    <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column
        prop="date"
        label="日期"
        width="180">
      </el-table-column>
      <el-table-column
        prop="name"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        prop="address"
        label="地址">
      </el-table-column>
    </el-table>
  </template>

  <script>
    export default {
      data() {
        return {
          tableData: [{
            date: '2016-05-02',
            name: '王小虎',
            address: '上海市普陀區(qū)金沙江路 1518 弄'
          }, {
            date: '2016-05-04',
            name: '王小虎',
            address: '上海市普陀區(qū)金沙江路 1517 弄'
          }, {
            date: '2016-05-01',
            name: '王小虎',
            address: '上海市普陀區(qū)金沙江路 1519 弄'
          }, {
            date: '2016-05-03',
            name: '王小虎',
            address: '上海市普陀區(qū)金沙江路 1516 弄'
          }]
        }
      }
    }
  </script>
回答
編輯回答
離殤

借用樓上的寫法 異步的話 需要先判斷data是否有值:

<el-table-column v-for="(item,index) in data" :key='index' v-if="data.length>0" :prop="item.prop" :label="item.label" :width='item.width'></el-table-column>
2017年10月18日 13:28
編輯回答
逗婦乳

如果沒有插槽可以使用v-for,復(fù)雜的話建議使用render函數(shù)

data = [
    {prop:'data',label:'日期',width:'180'},
    {prop:'name',label:'姓名',width:'180'},
    {prop:'address',label:'地址'}
]

<el-table-column v-for="(item,index) in data" :key='index' :prop="item.prop" :label="item.label" :width='item.width'></el-table-column>
2017年1月23日 14:56
編輯回答
凹凸曼
用for循環(huán)表格數(shù)據(jù)就行<el-table-column v-for="(item,index) in list" :key='index' :prop="item.prop" :label="item.label"></el-table-column>
2017年11月23日 03:36