制表符 4.2 : sorter :"date" not working?

Question

即使在@Tabulator 站点给出的示例中也是如此:

http://tabulator.info/basic/4.2

与其他列不同，日期列不排序。有解决办法吗？

Answer 1

Tabulator 的日期排序依赖于 MomentJS。将 Moment Js 导入您的代码

{title: "Date Of Birth", field: "dob", sorter:"date", sorterParams:{format:"DD/MM/YY"}},

请检查此代码段

  const tabledata1 = [
    {id: 1, name: "Oli ", money: "0", col: "red", dob: "14/05/1982"},
    {id: 2, name: "Mary ", money: "0", col: "blue", dob: "14/05/1982"},
    {id: 3, name: "Christine ", money: "0", col: "green", dob: "22/05/1982"},
    {id: 4, name: "Brendon ", money: "0", col: "orange", dob: "01/08/1980"},
    {id: 5, name: "Margret ", money: "0", col: "yellow", dob: "31/01/1999"},
  ];



  const table = new Tabulator("#example-table", {
    height: 205, // set height of table (in CSS or here), this enables the Virtual DOM and improves render speed dramatically (can be any valid css height value)
    data: tabledata1, //assign data to table
    layout: "fitColumns", //fit columns to width of table (optional)
    columns: [ //Define Table Columns
      {title: "Name", field: "name", width: 150},
      {
        title: "money",
        field: "money",
        align: "left",
        formatter: "money"
      },
      {title: "Favourite Color", field: "col"},
      {title: "Date Of Birth", field: "dob", sorter:"date", sorterParams:{format:"DD/MM/YY"}},
    ]
  });

  function removeData() {
    table.clearData();
  }

  function update() {
    table.updateOrAddData(tabledata2);
    // table.addData(tabledata2);
  }

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script src="https://unpkg.com/tabulator-tables@4.2.4/dist/js/tabulator.min.js"></script>
<link href="https://unpkg.com/tabulator-tables@4.2.4/dist/css/tabulator.min.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-3.4.0.min.js"></script>

<div id="example-table"></div>