暗影截 2022-10-08 14:54 采纳率: 75%
浏览 53
已结题

vue2引入swiper5的时候一直提示swiper没有声明文件

vue2引入swiper5的时候一直提示swiper没有声明文件,有什么办法解决让轮播图转起来

                <div class="swiper-container" id="mySwiper">
                    <div class="swiper-wrapper" ref="mySwiper" :options="swiperOptions">
                        <div class="swiper-slide" v-for="carousel in bannerList" :key="carousel.id">
                            <img :src="carousel.imgUrl" />
                        </div>
                    </div>
                    
                    <div class="swiper-pagination"></div>

                    
                    <div class="swiper-button-prev"></div>
                    <div class="swiper-button-next"></div>
                </div>

<script>
//引入swiper,就是这里有问题
import {Swiper} from 'swiper'

export default {
    name: 'MyListContainer',
    computed: {
        ...mapState({
            bannerList: state => state.home.bannerList
        })
    },
    mounted() {
        //通知vuex发请求,获取数据并存储于state中
        this.$store.dispatch('getBannerList')

        //轮播图的swiper实例化
        setTimeout(() => {
           //这里mySwiper一直提示已声明“mySwiper”,但从未读取其值
            var mySwiper = new Swiper(document.querySelector('.swiper-container'), {
                direction: 'vertical', // 垂直切换选项
                loop: true, // 循环模式选项

                // 如果需要分页器
                pagination: {
                    el: '.swiper-pagination',
                    clickable:true
                },

                // 如果需要前进后退按钮
                navigation: {
                    nextEl: '.swiper-button-next',
                    prevEl: '.swiper-button-prev',
                },

                // 如果需要滚动条
                scrollbar: {
                    el: '.swiper-scrollbar',
                },
            })
        },1000)
    },
}
</script>

//引入swiper样式,main.js里只有这一句

import 'swiper/css/swiper.css'

是看尚硅谷前端项目-尚品汇第36集遇到的问题,视频里面按我贴的这样写就成功了,但我有这两个问题,怎么搞都搞不好,来个人救我吧
  • 写回答

4条回答 默认 最新

  • 你好!机器人 2022-10-08 15:17
    关注

    安装依赖了吗

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 2月13日
  • 已采纳回答 2月13日
  • 创建了问题 10月8日

悬赏问题

  • ¥15 微信小程序协议怎么写
  • ¥15 c语言怎么用printf(“\b \b”)与getch()实现黑框里写入与删除?
  • ¥20 怎么用dlib库的算法识别小麦病虫害
  • ¥15 华为ensp模拟器中S5700交换机在配置过程中老是反复重启
  • ¥15 java写代码遇到问题,求帮助
  • ¥15 uniapp uview http 如何实现统一的请求异常信息提示?
  • ¥15 有了解d3和topogram.js库的吗?有偿请教
  • ¥100 任意维数的K均值聚类
  • ¥15 stamps做sbas-insar,时序沉降图怎么画
  • ¥15 买了个传感器,根据商家发的代码和步骤使用但是代码报错了不会改,有没有人可以看看