element表格实现树形全选_element 树形表格 列内全选、input同步更改、筛选

需求：树形表格、列内全选/反选、input数据同步更改、筛选数据

效果图：

table组件

style="width: 100%;"

@filter-change="filterChange"

:tree-props="{children: 'children', hasChildren: 'hasChildren'}"

:row-style="{height: '50px'}"

:cell-style="{padding: '0'}"

:header-cell-style="headeRrowStyle"

:indent="20"

:header-row-style="{'border-radius':'10px'}"

@selection-change="selectionChange"

>

:indeterminate="childScope.row.indeterminate[childScope.column.property]"

v-model="childScope.row.checked[childScope.column.property]"

@change="checkChange(childScope)">{ { }}

{ {childScope.row[childScope.column.property]}}

{ {childScope.row[childScope.column.property]}}

{ {childScope.row[childScope.column.property]}}

style="color:#fff"

v-model="allChecked[item.prop]"

@change="allSelect(item.prop)"

>{ {item.name}}

{ { }}

{ {childScope.row[scope.column.property]}}

{ {scope.row[scope.column.property]}}

{ {scope.row[scope.column.property]}}

export default {

name: "l-TableCompont",

data() {

return {

arrFin:{jg:[],ll:[],qt:[],kcts:[]}

};

},

props: {

tableData: {

type: Array,

default () {

return [

{

id: 1,

date: "2016-05-02",

name: "王小虎",

province: "山西",

city: "平遥",

indeterminate:{name:false,address:false,province:false,city:false},

checked:{name:false,address:false,province:false,city:false},pid:null,

address: "上海市普陀区金沙江路 1518 弄",zip: 200333,

speed:"30%"

},

{

id: 2,

date: "2016-05-04",

province: "山东",

city: "济南",

indeterminate:{name:false,address:false,province:false,city:false},

name: "王小虎",checked:{name:false,address:false,province:false,city:false},pid:null,

address: "上海市普陀区金沙江路 1517 弄",zip: 200333,speed:"30%"

},

{

id: 3,

date: "2016-05-01",

province: "四川",

city: "成都",

indeterminate:{name:false,address:false,province:false,city:false},

name: "王小虎",checked:{name:false,address:false,province:false,city:false},pid:null,

address: "上海市普陀区金沙江路 1519 弄",zip: 200333,speed:"30%",

children: [

{

id: 31,

date: "2016-05-099",

pid:3,

province: "天津",

city: "滨海",

indeterminate:{name:false,address:false,province:false,city:false},

name: "王小虎",checked:{name:false,address:false,province:false,city:false},

address: "上海市普陀区金沙江路 1519 弄",zip: 200333,speed:"30%",

children:[

{

id: 311,

date: "2016-05-0999",

pid:31,

indeterminate:{name:false,address:false,province:false,city:false},

province: "北京",

city: "朝阳",

name: "王小虎",checked:{name:false,address:false,province:false,city:false},

address: "上海市普陀区金沙江路 1519 弄",zip: 200333,speed:"30%"

}

]

},

{ <