1.增加treeTable的使用功能说明
This commit is contained in:
parent
00f4714b43
commit
88c05b9ae6
|
@ -32,7 +32,10 @@
|
||||||
export default {
|
export default {
|
||||||
name: 'tree-table',
|
name: 'tree-table',
|
||||||
props: {
|
props: {
|
||||||
data: [Object, Array],
|
data: {
|
||||||
|
type: [Array, Object],
|
||||||
|
required: true
|
||||||
|
},
|
||||||
columns: {
|
columns: {
|
||||||
type: Array,
|
type: Array,
|
||||||
required: true
|
required: true
|
||||||
|
@ -47,9 +50,11 @@ export default {
|
||||||
computed: {
|
computed: {
|
||||||
// 格式化数据源
|
// 格式化数据源
|
||||||
formatData: function() {
|
formatData: function() {
|
||||||
|
if (!Array.isArray(this.data)) {
|
||||||
|
this.data = [this.data]
|
||||||
|
}
|
||||||
const func = this.evalFunc || treeToArray
|
const func = this.evalFunc || treeToArray
|
||||||
const args = this.evalArgs ? Array.concat([this.data], this.evalArgs) : [this.data, this.expandAll]
|
const args = this.evalArgs ? Array.concat([this.data], this.evalArgs) : [this.data, this.expandAll]
|
||||||
console.log(args)
|
|
||||||
return func.apply(null, args)
|
return func.apply(null, args)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
|
@ -0,0 +1,66 @@
|
||||||
|
##prop说明
|
||||||
|
###data
|
||||||
|
必输
|
||||||
|
|
||||||
|
原始数据,要求是一个数组或者对象
|
||||||
|
```javascript
|
||||||
|
[{
|
||||||
|
key1:value1,
|
||||||
|
key2:value2,
|
||||||
|
children:[{
|
||||||
|
key1:value1
|
||||||
|
},{
|
||||||
|
key1:value1
|
||||||
|
}]
|
||||||
|
},{
|
||||||
|
key1:value1
|
||||||
|
}]
|
||||||
|
```
|
||||||
|
或者
|
||||||
|
```javascript
|
||||||
|
{
|
||||||
|
key1:value1,
|
||||||
|
key2:value2,
|
||||||
|
children:[{
|
||||||
|
key1:value1
|
||||||
|
},{
|
||||||
|
key1:value1
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
```
|
||||||
|
###columns
|
||||||
|
必输
|
||||||
|
|
||||||
|
列属性,要求是一个数组
|
||||||
|
|
||||||
|
1. text: 显示在表头
|
||||||
|
2. value: 对应data的key,treeTable将显示相应的value
|
||||||
|
3. width: 每列的宽度,为一个数字
|
||||||
|
```javascript
|
||||||
|
[{
|
||||||
|
value:string,
|
||||||
|
text:string,
|
||||||
|
width:number
|
||||||
|
},{
|
||||||
|
value:string,
|
||||||
|
text:string,
|
||||||
|
width:number
|
||||||
|
}]
|
||||||
|
```
|
||||||
|
### expandAll
|
||||||
|
是否默认全部展开,boolean值,默认为false
|
||||||
|
### evalFunc
|
||||||
|
解析函数,function,非必须
|
||||||
|
|
||||||
|
如果不提供,将使用默认的evalFunc
|
||||||
|
|
||||||
|
如果提供了evalFunc,那么会用提供的evalFunc去解析data,并返回treeTable渲染所需要的值。如何编写一个evalFunc,请参考此目录下的*eval.js*
|
||||||
|
|
||||||
|
### evalArgs
|
||||||
|
解析函数的参数,是一个数组
|
||||||
|
|
||||||
|
**请注意,自定义的解析函数参数第一个为this.data,你不需要在evalArgs填写。**
|
||||||
|
|
||||||
|
如你的解析函数需要的参数为`(this.data,1,2,3,4)`,那么你只需要将`[1,2,3,4]`赋值给`evalArgs`就可以了
|
||||||
|
## slot
|
||||||
|
请参考`customTreeTable`
|
Loading…
Reference in New Issue