vue移动端swiper轮播

• Z时代
• 2024-01-10
• 分类：综合

[vue 移动端 swiper 轮播]（日常记录）

(一个简单的商城类项目的常用商品轮播)

目前移动端做好的轮播组件 肯定是swiper，所以咱们也是用了swiper

1 npm 安装

在指定的目录下

npm install vue-awesome-swiper --save

2引用

全局；在main.js中

import Vue from ‘vue’

import VueAwesomeSwiper from ‘vue-awesome-swiper’

// require styles

import ‘swiper/dist/css/swiper.css’

Vue.use(VueAwesomeSwiper, /* { default global options } */)

局部引用

// require styles

import ‘swiper/dist/css/swiper.css’

import { swiper, swiperSlide } from ‘vue-awesome-swiper’

export default {

components: {

swiper,

swiperSlide

}

}

swiper参数很多，官网链接：https://www.swiper.com.cn/usage/index.html

，，

下面是源码，

欢迎学习讨论，大神绕道

以上是 vue移动端swiper轮播 的全部内容， 来源链接： utcz.com/z/377639.html