vue项目iview树形控件怎么样运用？
发布时间：2022-04-12 04:36:22 所属栏目：语言 来源：互联网
导读：vue项目iview树形控件怎么样使用？在vue项目中， iview的树形控件的使用还是比较多的，因此这篇文章就给大家分享一下 iview的树形控件的用法，感兴趣的朋友就继续往下看吧。 1.开发环境 vue+iview 2.电脑系统 windows10专业版 3.在使用 vue+iview开发的过
|
vue项目iview树形控件怎么样使用？在vue项目中， iview的树形控件的使用还是比较多的，因此这篇文章就给大家分享一下 iview的树形控件的用法，感兴趣的朋友就继续往下看吧。 1.开发环境 vue+iview 2.电脑系统 windows10专业版 3.在使用 vue+iview开发的过程中,我们经常会使用 iview的树形控件,在这里我就简单的做一个分享,希望对你有所帮助! 4.在template中添加如下代码: <Scroll style="width: 100%" height="760"> <Tree @on-select-change="chentreelick" :data="treedata" expand-node ></Tree> </Scroll> 5.在 return 中添加如下代码: treedata: [ { title: "parent 1", chenshow: false, expand: true, children: [ { title: "parent 1-1", chenshow: false, expand: true, children: [ { title: "leaf 1-1-1", chenshow: true, }, { title: "leaf 1-1-2", chenshow: true, selected: true, }, ], }, { title: "parent 1-2", chenshow: false, expand: true, children: [ { title: "leaf 1-2-1", chenshow: true, }, { title: "leaf 1-2-1", chenshow: true, }, ], }, { title: "parent 1-3", chenshow: false, expand: true, children: [ { title: "leaf 1-3-1", chenshow: true, }, { title: "leaf 1-3-1", chenshow: true, }, ], }, { title: "parent 1-4", chenshow: false, expand: true, children: [ { title: "leaf 1-4-1", chenshow: true, }, { title: "leaf 1-4-1", chenshow: true, }, ], }, { title: "parent 1-5", chenshow: false, expand: true, children: [ { title: "leaf 1-5-1", chenshow: true, }, { title: "leaf 1-5-1", chenshow: true, }, ], }, { title: "parent 1-6", chenshow: false, expand: true, children: [ { title: "leaf 1-6-1", chenshow: true, }, { title: "leaf 1-6-1", chenshow: true, }, ], }, { title: "parent 1-7", chenshow: false, expand: true, children: [ { title: "leaf 1-7-1", chenshow: true, }, { title: "leaf 1-7-1", chenshow: true, }, ], }, { title: "parent 1-8", chenshow: false, expand: true, children: [ { title: "leaf 1-8-1", chenshow: true, }, { title: "leaf 1-8-1", chenshow: true, }, ], }, { title: "parent 1-9", chenshow: false, expand: true, children: [ { title: "leaf 1-9-1", chenshow: true, }, { title: "leaf 1-9-1", chenshow: true, }, ], }, ], }, ], （编辑：宁德站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
