# Vue外送平台App-(swiper安裝使用)
[Swiper API](https://www.swiper.com.cn/)
1. 先安裝 npm install --save swiper
2. Miste.vue需要用到swiper輪
3. import Swiper本身和css style
4. 需看架構如何定義(程式碼3.)

<script>
//第三方組件
//1.載入
import Swiper from 'swiper';
import 'swiper/swiper-bundle.css';

import HeaderTop from '../../components/HeaderTop/HeaderTop';
import ShopList from '../../components/ShopList/ShopList';
export default {
    //2.創建Swiper實力對象,來實現輪播
    mounted() {
        //3.找html有沒有swiper-container這個class
        new Swiper('.swiper-container', {
            // 4.循環模式選項
            loop: true,
            
            // 5.配置對象:分頁器(要有相對應的swiper-pagination)
            pagination: {
                el: '.swiper-pagination',
            },

        })
    },
    components: {
        HeaderTop,
        ShopList
    }
}