有赞商城项目轮播组件的实现(swiper)

swiper下载

yarn add swiper

引入

import Swiper from 'swiper'
import 'swiper/dist/css/swiper.css'

使用

1.请求数据

    getBanner() {
      axios.get(url.banner).then(res => {
        this.bannerLists = res.data.lists
      })
    }

2.挂载到页面上

3.使用
html

js

  mounted() {
    this.init()
  },
  methods: {
    init() {
      new Swiper('.swiper-container', {
        autoplay: true,
        pagination: '.swiper-pagination'
      })
    }
  }