vue ui依赖里添加jquery ,或者下面这样添加。
npm install jquery --save
添加完之后,package.json的dependencies里会多出 jquery
找到下面的eslintConfig,在env里添加"jquery":true
"eslintConfig": {
"root": true,
"env": {
"node": true,
"jquery":true
},
vue.config.js
顶部先引入webpack
const webpack = require('webpack')
module.exports = {
configureWebpack: {
plugins: [
new webpack.ProvidePlugin({
$:"jquery",
jQuery:"jquery",
"windows.jQuery":"jquery"
})
]
}
}
如果同时还是用了vux的话,原来就是会这样的
configureWebpack: config => {
require('vux-loader').merge(config, {
options: {},
plugins: ['vux-ui'],
}),
这个时候就就应该直接push上去
configureWebpack: config => {
require('vux-loader').merge(config, {
options: {},
plugins: ['vux-ui'],
}),
config.plugins.push(new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
"windows.jQuery": "jquery"
}))
},
最后直接在main.js里引用
import $ from 'jquery';
直接在页面的methods:{}使用就好了
//点击左边的人名
changeHandler(label) {
const a = label.a;
const b = label.b;
$(".cube-index-list-content ul li").removeClass("dianjilezhege");
$(".cube-index-list-content ul>li:nth-child("+a+")>ul>li:nth-child("+b+")").addClass("dianjilezhege");