1.0.5 • Published 5 years ago
vue-ztree-component v1.0.5
vue-ztree-component
一个不依赖ztree的vue ztree插件
项目中需要使用到和ztree一样效果的树状图组件,考虑引入jQuery和ztree过于庞大,得不偿失,简单封装一个基于vue的ztree组件。后期会考虑加入更多可配置性功能。
Build Setup
# install dependencies
npm install vue-ztree-component -S
# use
main.js
import ZtreeComponent from 'vue-ztree-component'
Vue.use(ZtreeComponent)
everyone.vue
import ZtreeComponent from 'vue-ztree-component'
components:{
ZtreeComponent
}
<ztree-component :nodes="list" @handle="handle" ></ztree-component>
- nodes接受一个数组,数组格式如下 id name为必传项
- @handle接受一个函数,点击节点时触发,默认参数为当前点击节点的信息(对象)demo地址
list = [{
id: "1",
name: "父节点1",
childArr: [{
id: "1-1",
name: "子节点1-1",
childArr: [
{
id: "1-1-1",
name: "子节点1-1-1"
}, {
id: "1-1-2",
name: "子节点1-1-2"
}, {
id: "1-1-3",
name: "子节点1-1-3"
}
]
},
{
id: "1-2",
name: "子节点1-2"
}, {
id: "1-3",
name: "子节点1-3"
}]
},{
id: "1",
name:'父节点2-无子元素'
}]