【问题标题】:How to avoid responsive tables in Buefy如何避免 Buefy 中的响应式表格
【发布时间】:2018-11-21 03:27:01
【问题描述】:

在 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>
            ...

隐藏详细的列数据有效,但当视口较小时,表格仍会切换到卡片视图。

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

【问题讨论】:

  • 你的意思是响应式的,而不是反应式的。
  • 确实如此。修好了。

标签: css vue.js bulma buefy


【解决方案1】:

根据documentation可以通过绑定表的mobile-cards属性到false来关闭手机卡。

据我了解,您应该能够使用:

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

【讨论】:

  • 谢谢我只是瞎了眼!
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-07-06
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-09-12
相关资源
最近更新 更多