![a5019359b885d07fdeff23d5918bb6c7.png](https://i-blog.csdnimg.cn/blog_migrate/070a3087bf6e0a44b29b6f28f7c67fd6.jpeg)
首先默认你已经有了一个vue程序,如果你想在vue中使用jquery,那么请继续阅读。
当然,加入你没有一个vue程序,这里也给出创建一个vue程序的命令。当然,你肯定装了vue-cli,不然你不会点进这篇博客
vue init webpack vue-demo01
项目的目录类似如下:
![252999ce5d9ad7ca7d49c3e3054e36c5.png](https://i-blog.csdnimg.cn/blog_migrate/178102a28432b81530d8f60c50b0cfec.jpeg)
对了,这个demo里使用了element-ui
安装方式:
npm i element-ui -S
配置方式:
![40ef43c5b0417c46b05f5c45b1c0dd02.png](https://i-blog.csdnimg.cn/blog_migrate/5f508b48745fc7b209cc6fb359387b75.jpeg)
可以直接拷走
import ElementUI from 'element-ui';import 'element-ui/lib/theme-chalk/index.css';Vue.use(ElementUI);
jquery安装
直接运行下面的命令
npm run jquery
jquery引用
在需要使用jquery的组件里,引入jquery后,即可正常使用
import $ from 'jquery'
举例
HelloWorld.vue
list.json
[{ "label": "一级 1", "children": [{ "label": "二级 1-1", "children": [{ "label": "三级 1-1-1" }] }]}, { "label": "一级 2", "children": [{ "label": "二级 2-1", "children": [{ "label": "三级 2-1-1" }] }, { "label": "二级 2-2", "children": [{ "label": "三级 2-2-1" }] }]}, { "label": "一级 3", "children": [{ "label": "二级 3-1", "children": [{ "label": "三级 3-1-1" }] }, { "label": "二级 3-2", "children": [{ "label": "三级 3-2-1" }] }]}]
运行效果:
![8c5c5f7a319dc48f9be9cdec697046bf.png](https://i-blog.csdnimg.cn/blog_migrate/f3f90bca6d21ccf669da76e6f91c502e.jpeg)
如果需要源码,在下面下载
下载地址:https://download.csdn.net/download/iiiliuyang/12127883
如果这篇博客对你有用,点个赞再走呗~