vue中如何使用ztree

下面给大家介绍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，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对错新站长站网站的支持！