vue+element-ui 实现可编辑表格、动态渲染表头和表格数据、列向数据合计（每行末尾合计功能）

vue + element 实现可编辑表格、动态渲染表头表格数据、列向数据合计（每行末尾合计）

1，首先得在项目中集成element-ui 安装，注册，具体参照 element-ui的集成

2，我这里使用的vue-cli脚手架搭建的项目，可网上搜索相关知识

3，我的需求，做一个比赛项目打分表，评委可以实现在线打分，表头和表格数据首先都是动态获取后台数据进行渲染，这里我先写成假数据以供大家参考

4，HTML部分代码

<template>
  <div>
    <el-container>
      <el-header>Header</el-header>
      <el-main>
        <div>
         // 表格数据在这里： :data="tableData"
          <el-table
            border
            :data="tableData"
            class="tb-edit"
            style="width: 100%"
            highlight-current-row
            @row-click="handleCurrentChange"
          >
            <el-table-column label="项目名称">
              <template scope="scope">
                <span>{
   {
    scope.row.item }}</span>
              </template>
            </el-table-column>
            
                 //  动态循环表头数据
            <el-table-column :label="item.val" v-for="(item,index) in tableHead" :key="index">
              <template scope="scope"