# element-tree-grid **Repository Path**: sy_liyang/element-tree-grid ## Basic Information - **Project Name**: element-tree-grid - **Description**: No description available - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2021-12-27 - **Last Updated**: 2021-12-27 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # element-tree-grid

tree grid extends `element` ui with `vue` **having problems** with `` if you have any idea , **welcome !!!** > [demos](http://htmlpreview.github.io/?https://github.com/foolishchow/element-tree-grid/blob/master/example/test.html) > 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

``` - 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 ``` - with formatter ```html ``` - with scopedSolts ```html ```