下面給大家介紹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: "父節(jié)點1", children: [      {name: "子節(jié)點1"},      {name: "子節(jié)點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，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對錯新站長站網(wǎng)站的支持！