如何解决我如何使 Vuetify 轮播图像响应,尤其是在移动屏幕上?
我也尝试过使用 CSS 来实现这一点,但似乎不起作用,我知道 Vuetify 轮播响应不够灵敏,但我觉得 Veutify 团队现在应该已经解决了这个问题,或者有更好的方法来实现这一点吗?
<v-flex xs12 md8 lg6 >
<v-carousel style="border-radius:4px; " height="400px" class="slides">
<v-carousel-item
class="slides"
v-for="(item,i) in items"
:key="i"
:src="item.src"
reverse-transition="fade-transition"
transition="fade-transition"
>
</v-carousel-item>
</v-carousel>
</v-flex>
解决方法
Vuetify carousel 老实说是一个糟糕的 carousel 组件
我已经数不清有多少人抱怨它缺乏响应能力
没有“Vuetify”的方式来做你想做的事,你不能使用 <v-responsive>
来解决这让你有两个主要选择:
- 为轮播使用不同的组件。 Vuetify 树抖动,因此您不会因使用或不使用而浪费/节省任何包大小。您可以使用专用的轮播插件,该插件功能更强大、更灵活,并且实际上可以在移动设备上正常运行。这是我建议的选项。
- 编写大量自定义 CSS 以覆盖组件本身的某些部分。
不幸的是,没有更好的解决方案。我一直主张只使用高级轮播组件!
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。