美化元素滚动条：https://github.com/malihu/malihu-custom-scrollbar-plugin
vue项目：
安装依赖文件：
npm install imports-loader
npm install jquery-mousewheel
npm install malihu-custom-scrollbar-plugin
webpack.base.config.js 文件
module.exports = {
module: {
loaders: [
{ test: /jquery-mousewheel/, loader: "imports?define=>false&this=>window" },
{ test: /malihu-custom-scrollbar-plugin/, loader: "imports?define=>false&this=>window" }
]
}
};
package.json文件添加：
"jquery": "^3.1.1",
"jquery-mousewheel": "^3.1.13",
"malihu-custom-scrollbar-plugin": "^3.1.5"
Scroll.vue文件:
<template>
</template>
<script>
import Vue from 'vue'
import $ from 'jquery'
import 'jquery-mousewheel'
import 'malihu-custom-scrollbar-plugin'
import '../assets/css/jquery.mCustomScrollbar.css'
Vue.directive('scroll', {
bind(el) {
Vue.nextTick(() => {
$(el).mCustomScrollbar({
mouseWheel: true,
theme: 'dark'
})
})
},
update(el) {
$(el).mCustomScrollbar('update')
}
})
