我发现一个奇怪的现象,但是看了文档也无法找到答案

来源:4-4 更新滚动条和图片的懒加载

10hours

2020-04-30 20:49:24

在Home父组件

http://img.mukewang.com/climg/5eaac819092144f506960389.jpg

只需要传入data,让子组件接收

http://img.mukewang.com/climg/5eaac8d1093a4d5508290798.jpg

不需要像老师那样调用swiper.update()方法

甚至不需要写props接收参数!

http://img.mukewang.com/climg/5eaac8f809a1661b05390722.jpg

都可以产生滚动条。

是因为swiper这个插件接受了参数自动更新的原因吗?

然后老师调用update是为了看起来更有语义化?

还是我代码写错了??撞运气

写回答

1回答

好帮手慕慕子

2020-05-01

同学你好,老师以源码测试为例,解答如下:

因为老师这里为了让图片以正方形显示,给外层元素设置了padding-top值,相当于图片还没有加载时,在页面中已经占据位置了。如下:

http://img.mukewang.com/climg/5eab873c09cb114e26001452.jpg

所以不传递data,第一屏是可以正常滚动的,但是再加载数据之后,不能更新滚动条,滑动到下一屏,示例:

http://img.mukewang.com/climg/5eab87d409031e8b11080704.jpg

推荐同学参考老师的方式,传递参数,在watch中通过监听data的变化,实时更新滚动条。示例:

http://img.mukewang.com/climg/5eab881a095c89df04840252.jpg

如果我的回答帮助到了你,欢迎采纳,祝学习愉快~

0

0 学习 · 10739 问题

查看课程