这篇文章主要介绍了vue中如何使用ztree,包括配置package.json，自动加载jquery的方法，本文给大家介绍的非常详细，具有参考借鉴价值，需要的朋友可以参考下
下面给大家介绍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
电力公司企业网站(Zblog内核)1.8
下载
由于我高估了大家对zblog程序的熟知度，发现还有很多站长并不是太熟悉这款程序，甚至连后台的登陆入口都不清楚。所以我晚上抽了一点点时间把该ZBLOG企业网站源码进行的修正，补充了大家的一些问题。并且我写了比较详细的使用教程，能够帮助新手朋友修改变成自己的企业网站使用。 修订版本改进了几处问题： 第一，修正了单页面中的顶部BANNER FLASH幻灯图片的显示错误问题； 第二，修正了在产品中心标题显
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);
}
}上面是我整理给大家的，希望今后会对大家有帮助。
相关文章：
