老师想问下这个Vue-Awesome-Swiper插件如何加swiper配合vue工作,最终渲染成的
看检查,最终是swiper Html结构
基础组件引入import {swiper} from 'vue-awesome-swiper';
这样是把swiper html结构搭建起来吧
基础组件中,写的结构符合Vue-Awesome-Swiper,但还没有引入swiper-slide ,只有swiper标签对,里面内容也只放了分页,通过参数判断最终插槽控制插入。
在业务组件中,自定义了一个类为slider-wapper 的div,里面放引入基础组件并命名me-slider,所以swiper Html结构最终是嵌入到它里面的。在业务组件里,还引入import {swiperSlide} from 'vue-awesome-swiper';这样就把swiperSlide标签对弄过来,这样基础组件和业务组件配合,变成Vue-Awesome-Swiper插件的结构,完成轮播功能,通过参数控制。
这里有几个疑惑
1,基础组件和业务组件是分别引入Vue-Awesome-Swiper吧,{ xx } 这里用括号方式的说明是变量吧
import MeSlider from 'base/slider';
import {swiperSlide} from 'vue-awesome-swiper';
import {sliderOptions} from './config';
像这里第一个,引入基础组件只需要这里命名MeSlider ,不用{ };
这里还有什么说明吗?
2,基础组件和业务组件都 from 'vue-awesome-swiper'
这样他们的div不会嵌套引入吗,就是swiper插件的div HTML结构
3,Vue-Awesome-Swiper 里的变成swiper 里的div结构,应该是它源码上如何变了吧
4,希望老师能够对这些说明下,指出上面自己分析的内容错误
正在回答 回答被采纳积分+1
- 参与学习 人
- 提交作业 209 份
- 解答问题 3299 个
本路径是通过ES6基础知识、运用Zepto、Swiper、fullPag等移动端常用工具包、以及当下流行框架Vue,结合多个实战案例,还原真实开发场景,最终实现手机端购物商城网页开发。
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星