<div style="float:left;border:1px solid red;height:100px;width:600px;"><el-form-item label="多语言配置" style="width:700px;" prop="validTanleHead"><el-input style="width: 180px" placeholder="请填写语言类型" v-model="lange_type" /><el-button class="filter-item" style="margin-left:0px;" type="primary" size="mini" @click="addLangeType()">添加语言类型</el-button><br /><span></span><div v-for="(item, index) in tableData"><!-- {{item}} -->{{index}} <el-button class="filter-item" style="margin-top:10px;" type="primary" size="mini" @click="addRow(index)">添加</el-button><el-table :data="item" :key="index" style="width: 100%" border fit highlight-current-row><el-table-column prop="type" label="type" width="150"><template slot-scope="scope"><el-input class="tabletext" v-model="scope.row.type" size="mini" autosize /></template></el-table-column><el-table-column prop="value" label="value" width="150"><template slot-scope="scope"><el-input class="tabletext" v-model="scope.row.value" size="mini" autosize /></template></el-table-column><el-table-column prop="color" label="color" width="150"><template slot-scope="scope"><el-input class="tabletext" v-model="scope.row.color" size="mini" autosize /></template></el-table-column><el-table-column prop="color" width="80"><template slot-scope="scope"><el-button size="mini" type="danger" @click="DeleteRow(scope.row,index)">删除</el-button></template></el-table-column></el-table></div></el-form-item></div>使用 Object.assign 可以解决
addLangeType () {if (this.lange_type == "") {this.$message.error("请填写语言类型");return}//console.log("添加语言类型")// key就是数组的下标for (var key in this.tableData) {console.log(key);if (key == this.lange_type) {this.$message.error("语言类型已存在,请勿重复添加!");return}// console.log(this.tableData[key]);}var lange_type = this.lange_typevar tempData = {[lange_type]: [{type: "",value: "",color: "",}]};this.tableData = Object.assign({}, this.tableData, tempData)},
