css - 如何避免 Buefy 中的响应表

Question

在 Buefy 表格中，我需要将数据显示为常规表格，在所有媒体上水平列，而不是在移动设备上使用堆叠卡片。为了适应内容，我使用媒体查询来简单地隐藏除最重要的列之外的所有列。

  <b-table :data="this.standings">
     <template slot-scope="props">
         <b-table-column field="pos" numeric>{{props.row.pos}}</b-table-column>
         <b-table-column field="name">{{props.row.name}}</b-table-column>
         <b-table-column field="details" :visible="useFullTable()">{{props.row.details}}</b-table-column>
            ...

隐藏详细列数据有效，但当视口(viewport)较小时表格仍会切换到卡片 View 。

有什么方法可以禁用响应行为？请注意，我只想为这一个表或 View 执行此操作，我不想以不同方式设置全局断点或完全禁用应用程序中的 react 表。

Answer 1

根据documentation您可以通过将表的 mobile-cards 属性绑定(bind)到 false 来关闭移动卡。

据我了解，您应该能够使用以下方法完成这项工作:

<b-table :data="this.standings" :mobile-cards="false">
// Table content
</b-table>