2020-02-25 23:03:38 +08:00
|
|
|
# 多选节点
|
2020-12-12 14:44:44 +08:00
|
|
|
|
2020-02-25 23:03:38 +08:00
|
|
|
设置 `multiple` 来允许多选节点。
|
2020-12-12 14:44:44 +08:00
|
|
|
|
2020-02-25 23:03:38 +08:00
|
|
|
```html
|
2020-12-12 14:44:44 +08:00
|
|
|
<n-tree multiple block-node :data="data" />
|
2020-02-25 23:03:38 +08:00
|
|
|
<n-divider />
|
2020-12-12 14:44:44 +08:00
|
|
|
<n-tree multiple block-node :data="data" v-model:selected-keys="value" />
|
2020-02-25 23:03:38 +08:00
|
|
|
```
|
2020-12-12 14:44:44 +08:00
|
|
|
|
2020-02-25 23:03:38 +08:00
|
|
|
```js
|
2020-12-12 15:33:41 +08:00
|
|
|
function createData (level = 4, baseKey = '') {
|
2020-02-25 23:03:38 +08:00
|
|
|
if (!level) return undefined
|
2020-12-12 14:44:44 +08:00
|
|
|
return Array.apply(null, { length: 6 - level }).map((_, index) => {
|
|
|
|
const key = '' + baseKey + level + index
|
|
|
|
return {
|
|
|
|
label: createLabel(level),
|
|
|
|
key,
|
|
|
|
children: createData(level - 1, key)
|
|
|
|
}
|
|
|
|
})
|
2020-02-25 23:03:38 +08:00
|
|
|
}
|
|
|
|
|
2020-12-12 15:33:41 +08:00
|
|
|
function createLabel (level) {
|
2020-02-25 23:03:38 +08:00
|
|
|
if (level === 4) return '道生一'
|
|
|
|
if (level === 3) return '一生二'
|
|
|
|
if (level === 2) return '二生三'
|
|
|
|
if (level === 1) return '三生万物'
|
|
|
|
}
|
|
|
|
|
|
|
|
export default {
|
2020-12-12 15:33:41 +08:00
|
|
|
data () {
|
2020-02-25 23:03:38 +08:00
|
|
|
return {
|
|
|
|
data: createData(),
|
|
|
|
value: []
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2020-12-12 14:44:44 +08:00
|
|
|
```
|