制表符根据屏幕分辨率设置列布局

Question

我正在尝试最新 tabulator 并且需要帮助。有人可以展示如何将制表符布局从 'fitData' 更改为 'fitColumns' 的正确方法吗根据屏幕宽度？我所做的只是屏幕宽度检测：

$(document).ready(function(){
  $( window ).resize(function() {
      var width = $( window ).width();
      if(width > 800) {
          console.log("size > 800");
          userTable.options.layout = "fitColumns";
          userTable.redraw(true);
      }
      if(width < 800) {
          console.log("size < 800");
          userTable.options.layout = "fitData";
          userTable.redraw(true);
      }
  }); });

但是这段代码不起作用！有人可以帮忙吗？非常感谢！

Answer 1

一旦 table 已加载，您将无法更改布局选项，您将不得不销毁 table 并重新加载它

最好的选择是在您第一次创建 table:

时执行此操作

var table = new Tabulator("#example-table", {
    layout:window.innerWidth > 800 ? "fitColumns" : "fitData",
    columns:[],
});

制表符根据屏幕分辨率设置列布局

tabulator set column layout according screen resolution

javascript

tabulator