「Vue」Vue cli3中引用mui-ui问题及解决办法

1、引用mui.js无效,top-bar划动,numbox点击无效等问题
解决办法:
-main.js中import mui from './lib/mui/js/mui.js'
Vue.prototype.$mui = mui
-vue组件中
mounted(){
this.$mui('.mui-scroll-wrapper').scroll({
deceleration: 0.0005 //flick 减速系数,系数越大,滚动速度越慢,滚动距离越小,默认值0.0006
});
},
2、解决上述问题后出现tabbar无法切换的问题
解决办法:
-找到tabbar的样式类mui-tab-item重写,修改类名即可 如:<router-link class="mui-tab-item-new" to="/search">
.mui-bar-tab .mui-tab-item-new.mui-active {
color: #007aff;
}
.mui-bar-tab .mui-tab-item-new {
display: table-cell;
overflow: hidden;
width: 1%;
height: 50px;
text-align: center;
vertical-align: middle;
white-space: nowrap;
text-overflow: ellipsis;
color: #929292;
}
.mui-bar-tab .mui-tab-item-new .mui-icon {
top: 3px;
width: 24px;
height: 24px;
padding-top: 0;
padding-bottom: 0;
}
.mui-bar-tab .mui-tab-item-new .mui-icon~.mui-tab-label {
font-size: 11px;
display: block;
overflow: hidden;
text-overflow: ellipsis;
}
3、build时候出错,显示SVG之类的错误
解决办法:
-在引入的mui.css或mui.min.css中查找SVG,单引号改为双引号即可

猜你喜欢

转载自www.cnblogs.com/wrxblog/p/10499669.html
今日推荐