报错 'update' of undefined
来源：4-4 更新滚动条和图片的懒加载
qq_我不是看不起_0
2020-04-28 21:25:30
<template>
<swiper :options="swiperOption" ref="swiper">
<swiper-slide>
<slot></slot>
</swiper-slide>
<div class="swiper-scrollbar" v-if="scrollbar" slot="scrollbar"></div>
</swiper>
</template>
<script>
import {Swiper,SwiperSlide} from 'vue-awesome-swiper';
export default {
name:'MeScroll',
components:{
Swiper,
SwiperSlide
},
props:{
scrollbar:{
type:Boolean,
default:true
},
data1:{
type:[Array,Object] // 数组或者对象
}
},
data(){
return{
swiperOption:{
direction: 'vertical',
slidesPerView: 'auto',
freeMode: true,
setWrapperSize: true,
scrollbar: {
el: this.scrollbar ? '.swiper-scrollbar' : null,
hide: true
}
}
}
},
watch:{
data1(){
this.update()
}
},
methods:{
update(){
this.$refs.swiper && this.$refs.swiper.swiper.update() // 更新滚动条，用swiper提供的api
}
}
}
</script>
<style lang="scss" scoped>
.swiper-container{
overflow: hidden;
width: 100%;
height: 100%;
}
.swiper-slide{
height: auto;
}
</style>
----------------------------------------------------
------------------------
老师这是哪里不对
2回答
-
同学你好，应该是版本的问题，老师授课时使用的版本是3.1.1。 同学修改后项目可以正常使用就可以了。
不过同学目前在学习阶段，推荐与老师讲解的版本保持一致会更好哦。示例：使用如下命令安装
npm install vue-awesome-swiper@3.1.1 -D
祝学习愉快~
0 -
好帮手慕慕子
2020-04-29
同学你好，只有部分代码无法进行测试，建议：将home/index.vue代码粘贴过来，另，将package.json中使用的swiper和vue-awesome-swiper插件的版本也粘贴过来，老师帮助同学更准确的测试下代码。
祝学习愉快~
0h020-04-29
相似问题