1、点击新增就push一个新对象

dataList:[]

dataList.push({name:'',value:''})

 2、然后利用Element框架的table的作用域插槽渲染出来 

 <el-table :data="dataList" >

                   <el-table-column prop="name" label="属性名">
                      <template slot-scope="scope">
                        <el-input  v-model="scope.row.name"/>
                      </template>
                    </el-table-column>

 </el-table>

 3、在表格输入，aa  、11 ，后dataList就变成[{name:aa,value:11}]

4、如何将[{name:aa,value:11}]转为{aa:11}?

newObj:{}

this.dataList.forEach((i) => {
        if (i.name && i.value) {
          let key = i.name;
          this.obj[key] = i.value;
        }
        }

 Finally，以下是gif图实现功能的完整代码

 <el-table :data="headersParams" style="width: 99.99%">
                    <el-table-column prop="name" label="属性名" width="150">
                      <template slot-scope="scope">
                        <el-input
                          v-model="scope.row.name"
                          autocomplete="off"
                          size="small"
                          placeholder="请输入属性名"
                        ></el-input>
                      </template>
                    </el-table-column>

                    <el-table-column prop="value" label="属性值" width="150">
                      <template slot-scope="scope">
                        <el-input
                          v-model="scope.row.value"
                          autocomplete="off"
                          size="small"
                          placeholder="请输入属性值"
                        ></el-input>
                      </template>
                    </el-table-column>
                    <el-table-column label="操作" width="100">
                      <template slot-scope="scope">
                        <el-button
                          size="mini"
                          type="danger"
                          plain
                          @click="delHeaders(scope.$index, scope.row)"
                          >删除</el-button
                        >
                      </template>
                    </el-table-column>
                  </el-table>
                  <i
                    class="el-icon-circle-plus-outline"
                    @click="addHeaders"
                  ></i>

addHeaders() {
      let length = this.headersParams.length;
      this.headersParams.push({
        id: parseInt(length) + 1,
        name: "",
        value: "",
      });
    },

  delHeaders(index, row) {
      this.$confirm("确认删除吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        //点击确定的操作(调用接口)
        for (var i = 0; i < this.headersParams.length; i++) {
          if (row.id == this.headersParams[i].id) {
            this.headersParams.splice(i, 1);
          }
        }
      });
    },  
  btnSave() {
      //Body,将列表数据转为对象存储
      this.bodyParams.forEach((i) => {
        if (i.name && i.value) {
          let key = i.name;
          this.bodyObj[key] = i.value;
        }
      });