SOURCE

console 命令行工具 X clear

                    
>
console
var Main = {
  data() {
    return {
      tableData: [{
        date: 1551322088449,
        name: 'Name1',
        select: 1,
        num: 26,
        flag: false,
        text: 'Content1',
        childrens:[
          {
            name:'subName1',
            select: 1,
            num: 26,
            flag: false,
            text: 'Content1',
          },
          {
            name:'subName2',
            select: 1,
            num: 26,
            flag: false,
            text: 'Content1',
          }
        ]
      },
      {
        date: 1552460833946,
        name: 'Name2',
        select: 0,
        num: 28,
        flag: true,
        text: 'Content2'
      },
       {
        date: 1552861035946,
        name: 'Name3',
        select: 0,
        num: 28,
        flag: true,
        text: 'Content3'
      }],
      options: [{
        label: 'Label1',
        value: 1
      },
      {
        label: 'Label2',
        value: 0
      }]
    }
  },
  methods:{
    addChildSheet(){
    	var childSheet = this.tableData[0].childrens;
      for(var i=0;i<childSheet.length;i++){
      	this.$refs.editable.insertAt(childSheet[i],this.tableData[1])
      }
      this.$set(this.tableData[0],'showClose',true);
    },
    closeChildSheet(scope){
      console.log(scope)
    	var childSheet = scope.row.childrens;
			this.$refs.editable.remove(childSheet);

    }
  }
};
var Ctor = Vue.extend(Main);
new Ctor().$mount('#app')
<script src="//unpkg.com/vue">
</script>
<script src="//unpkg.com/xe-utils">
</script>
<script src="//unpkg.com/element-ui">
</script>
<script src="//unpkg.com/vue-element-extends">
</script>
<div id="app">
  <template>
    <div>
      <el-button @click="addChildSheet">
        新增2行
      </el-button>
  
      <elx-editable ref="editable" :data.sync="tableData">
  
        <elx-editable-column
                        label="closeChild" align="center" 
                >
                    <template slot="" slot-scope="scope">
                        <div v-show="scope.row.showClose" >
                      
                          <el-button @click="closeChildSheet(scope)" type="danger" size="mini" plain>删除新增行</el-button>
                        </div>

                    </template>
                </elx-editable-column>
        <elx-editable-column prop="name" label="Readonly">
        </elx-editable-column>
        <elx-editable-column prop="select" label="Select" :edit-render="{name: 'ElSelect', options}">
        </elx-editable-column>
        <elx-editable-column prop="num" label="Number" :edit-render="{name: 'ElInputNumber'}">
        </elx-editable-column>
        <elx-editable-column prop="date" label="DatePicker" :edit-render="{name: 'ElDatePicker', attrs: {type: 'date', format: 'yyyy/MM/dd'}}">
        </elx-editable-column>
        <elx-editable-column prop="text" label="Input" :edit-render="{name: 'ElInput'}">
        </elx-editable-column>
      </elx-editable>
    </div>
  </template>
</div>
@import url("//unpkg.com/element-ui/lib/theme-chalk/index.css");
@import url("//unpkg.com/vue-element-extends/lib/index.css");