vue+element 實現動態數據表格及添加表格操作按鈕


      <!-- 表格 -->
      <el-table
        :data="tableData3"
        border
        id="el-table"
        style="width: 100%">
        <!-- 動態循環的列表 -->
        <template  v-for="(item, index) in tableLabel">
          <el-table-column
            :key="index"
            :prop="item.prop"
            :label="item.label"
            width="">
          </el-table-column>
        </template>
        <!-- 固定的列:從業人員 -->
        <el-table-column label="從業人員">
          <template slot-scope="scope">
      <el-button type="info" @click="">從業人員</el-button>
    </template>
        </el-table-column>        
      </el-table>
<script>
export default {
  name: "dataList",
  data() {
    return {
      tableData3: [
        {
          id: '1',
          number: '112',
          a: '這是個數據',
          b: '這是個數據'
        }, {
          id: '2',
          number: '113',
          a: '這是個數據',
          b: '這是個數據'
        }
      ],
      tableLabel: [
          {label: '序號', prop: 'id'},
          {label: '場所編號', prop: 'number'},
          {label: '表頭3', prop: 'a'},
          {label: '表頭4', prop: 'b'},
      ]
    }
  },
};
</script>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM