富贵资源网 Design By www.hznty.com
下面给大家介绍vue ztree 结合使用方法，一起看看吧！
配置package.json
打包下载jquery以及ztree
"dependencies": {
"element-ui": "^2.1.0",
"vue": "^2.5.2",
"axios": "^0.16.1",
"jquery":"3.3.1",
"vue-awesome":"2.3.4",
"ztree":"3.5.24"
},
自动加载jquery
项目build的时候自动加载jquery，并且输出到jQuery中，在ztree中会使用到jQuery。
plugins: [
new webpack.ProvidePlugin({
jQuery:'jquery',
$:'jquery',
})
]
import jquery以及ztree
import 'jquery' import 'ztree' import 'ztree/css/metroStyle/metroStyle.css'
调用ztree生成树形结构
export default {
data() {
return {
nodeData: [{
name: "父节点1", children: [
{name: "子节点1"},
{name: "子节点2"}
]
}],
setting:{
view: {
showLine: false
},
data: {
simpleData: {
enable: true
}
},
callback: {
onClick: this.getFileDesc
}
}
}
},
mounted(){
let nodeData = this.nodeData
$.fn.zTree.init($("#uploadtree"), this.setting, nodeData);
}
}
总结
以上所述是小编给大家介绍的vue中如何使用ztree，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！
富贵资源网 Design By www.hznty.com
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
富贵资源网 Design By www.hznty.com
暂无评论...