Vuetify 数据表在 Safari 中呈现问题

Posted 2023-02-23

【中文标题】Vuetify 数据表在 Safari 中呈现问题

【英文标题】：Vuetify Data tables render problem with Safari

【发布时间】：2019-03-19 23:54:28

【问题描述】：

我知道这应该很容易，但我还没有找到问题所在。我正在使用带有外部源的 Vuetify 数据表，除了 Safari（MacOS 和 ios）之外的任何浏览器都可以。

问题：当数据表大于视口时，无法在视口后渲染背景色。

您可以在此处查看 repo（附带演示）： https://github.com/davellanedam/vue-skeleton-mvp

在这里演示：https://vue-demo.daniel-avellaneda.com

凭据：[e-mail] / 12345

问题在于组件 adminCities.vue 和 adminUsers.vue

如何重现： 用小窗口启动 safari，然后滚动数据表，或者让 Safari 进入响应模式并选择 iPhone 8，然后滚动数据表。

滚动前：https://imgur.com/nimBnlG

滚动后：https://imgur.com/tGx2hgI

关于如何解决这个问题的任何线索？

【参考方案1】：

通过在 Safari 开发工具中从 table.v-table 中删除样式 max-width: 100%，问题得到解决。我的解决方法是覆盖该类：

<style>
table.v-table 
  max-width: none;

</style>