element-tree-grid

tree grid extends element ui with vue

#### releases v1.0.4
- try to expand row expanded after data reload

having problems with

if you have any idea , welcome !!!

> demos

> start

- clone to your project
``shell
git clone https://github.com/foolishchow/element-tree-grid.git
cd element-tree-grid
npm install #or yarn
npm run dev
`

- use with node
- install
`shell
npm install element-tree-grid --save
`
- in you project

`javascript
//common
var ElTreeGrid = require('element-tree-grid');
Vue.component(ElTreeGrid.name,ElTreeGrid);
`


> useage

- common useage
`html

file-icon="icon icon-file"
folder-icon="icon icon-folder"
prop="label" label="labelname" width="220">


`
- get children from remote
- html
`html



`
- javascript
`javascript
new Vue({
el: "#app",
data: {
model: {
menus: trees
}
},
methods:{
remote(row,callback){
// async or sync are both supported
setTimeout(function() {
callback(row.children)
},500)
}
}
})
`
- attributes
> all props of el-table-column are supported;

| name | description | values |
| ----------- | :--------------------------------------------------------------------------------------------- | :-------------------------------------------: |
| prop | same as el-table-column | |
| label | same as el-table-column | |
| width | same as el-table-column | |
| fixed | same as el-table-column | |
| resizable | same as el-table-column | |
| formatter | same as el-table-column | |
| className | same as el-table-column | |
| treeKey | the key for neasted parse | type:String,
default:'id' |
| childNumKey | the key of childNum | type:String,
default:'child_num' |
| parentKey | the key of parent_id | type:String,
default:'parent_id' |
| levelKey | the key of node's depth | type:String,
default:'depth' |
| childKey | the key of node's children been placed | type:String,
default:'children' |
| fileIcon | file icon className | type:String,
default:'el-icon-file' |
| folderIcon | folder icon className ,when opend use: folderIcon-open | type:String,
default:'el-icon-folder' |
| remote | remote method to get children | type:Function,
default:null |
| allRemote | request all data from remote ,you have to config prop remote first,default use request cache | type:Boolean,
default:false |
| expandAll | expand all nodes when loaded | type:Boolean,
default:false |
| expandKey | key tells if the line is opened at inited ( just expended once ) | type:String,
default:expanded |
| indentSize | indent number ,united in px | type:Number,
default:14 |

> examples

- common
`html
file-icon="icon icon-file"
folder-icon="icon icon-folder"
prop="label"
label="labelname"
width="220">
`

- with formatter
`html
file-icon="icon icon-file"
folder-icon="icon icon-folder"
prop="label"
label="labelname"
:formatter="formatter"
width="220">
`

- with scopedSolts
`html
file-icon="icon icon-file"
folder-icon="icon icon-folder"
prop="label"
label="labelname"
width="220">


``