通过swiper5了解vuecli脚手架的底层原理

对比swiper5轮播图对vuecli项目的推测

在学习利用swiper插件构建轮播图时，查看了利用原生js和vuecli项目搭建中的用法，通过对比来了解vue底层构建：
让我们一起来看一下我搭建的原生js

在javascript中：

在原生js中就是创建了一个Swiper对象且传入参数‘.swiper-container’和’swiper-button-next‘，‘.swiper-button-prev’参数构成的object对象,对html页面进行渲染,来完成js对html的传导
ok,很好理解

在vue中：

这里是html

在index.vue中我们观察,首先利用v-bind：对html的dom进行单向绑定,传入参数对象swiperOption,利用swiperOption设定的值来达到更改效果
swiperOption绑定整个
在swiperOption中设置键值对pagination进行挂载

标签：vuecli,vue,js,html,swiperOption,swiper5,脚手架,swiper
来源： https://blog.csdn.net/qq_44880532/article/details/116116035