使用vue-awesome-swiper的注意点

第一步 安装

进入项目目录 执行 cnpm/npm install vue-awesome-swiper 进行安装 需要注意的是css-loader和less-loader也需要安装 否则样式无法正常使用

第二步 调用

在main.js里添加如下代码

import VueAwesomeSwiper from 'vue-awesome-swiper' //引入插件

require('swiper/dist/css/swiper.css') //引入css 其他地方都没有写这一句 但是在实际操作中 这句话不能少

Vue.use(VueAwesomeSwiper) //调用插件

第三步 使用

    
        
            
        
        


4 修改

毫无疑问这个插件是很好用的 但是再好的组件也不能满足用户的所有要求 这款插件专注于功能 对于样式上的问题并没有给出太多方案

我做项目时 轮播图的分页器样式不是我要的 我在网上一直查找没有找到好的办法 索性就直接去改了插件里的样式 也就是刚开始引用的这个swiper.css 这种方法算是很粗暴的了 而且说实话我个人并不推荐使用这种方法 但是我目前没有好的办法 希望有大神知道的话可以提出好的意见

以上内容就是我在实际开发中结合前人的经验总结出来的 有任何问题欢迎大家指正 谢谢

你可能感兴趣的:(使用vue-awesome-swiper的注意点)