Vuetify Carouse轮播图 图片切换导致页面总是自动跳转到轮播图位置
begin
vuetify carouse轮播图 的图片自动切换的时候, 会自动聚焦跳转到轮播图自身的位置.
这导致了一个问题, 当屏幕同时显示着轮播图和其他内容时, 轮播图一自动切换, 页面就会自动跳转到轮播图的位置!
!!!
紧急补充!
经过十个测特效的测试 https://vuetifyjs.com/zh-Hans/styles/transitions/
终于发现, 仅仅是几个特效( 比如是出问题的淡入特效 ) 在图片切换的时候会重新跳回去!!!
最终选择了这两个不会导致图片重新跳转到原位置的特效!
Solution1
Solution2
我在找问题的时候, 也发现了一个有趣的问题
如果有 v-container 标签包裹的 带淡入特效的轮播图, 那么他会自动跳转 如下问题重现:
https://codepen.io/syousui/pen/pogZKPV?editors=1010
那么这样解决方案就有了,
要么像 Solution1 那样删掉淡入特效,
https://codepen.io/syousui/pen/pogZKPV?editors=1010
要么就删掉 v-container.
https://codepen.io/syousui/pen/pogZKPV?editors=1010
链接进不去请自行科学上网处理
end
我的项目中, 我尝试删掉所有带自适应属性的标签来试图通过 Solution1 来解决, 但是并没有效果
最终只得删了淡入切换的特效…
这个问题困扰了好几天了, 今天终于一行一行, 一个属性一个属性注释, 总结到了上述几个经验
如有其他见解欢迎讨论!