使日期时间列在 Vue Tables 2 中可排序

Question

我有一个自定义组件，它使用 Vue Tables 2 中的 v-client-table 方法。 table 有两列，其中一列是日期时间列（格式：MM/DD/YYYY h:mm A）。我有它作为 sortable，但它没有根据时间准确排序。其输出如下所示：

如您所见，它从 12:09 下午到 12:30 上午。不幸的是，这种 date/time 格式是必需的。

问题：有没有办法将 momentjs 合并到配置中以进行正确排序（不使用 client-side-sorting documentation 中显示的过滤器）？

下面是数据和选项：

export const content = {
    state: {
        columns: ['callDateTime', 'explanation'],
        tableData: [
            { callDateTime: '10/13/2017 10:09 AM', explanation: "Lorem ipsum dolor sit amet, consectetur adipiscing elit." },
            { callDateTime: '10/13/2017 12:30 AM', explanation: "Lorem ipsum dolor" },
            { callDateTime: '10/13/2017 12:09 PM', explanation: "Lorem ipsum dolor sit amet },
            { callDateTime: '10/13/2017 1:15 PM', explanation: "Ut a fringilla mauris" },
            { callDateTime: '10/13/2017 1:30 PM', explanation: "Lorem ipsum dolor" }
        ],
        options: {
            headings: {
                'callDateTime': 'Call Date/Time',
                'explanation': 'Interaction Notes',
            },
            filterable: 'false',
            sortable: 'callDateTime',                           
            orderBy: { column: 'callDateTime' },
            pagination: {
                edge: false,
                dropdown: false,
                chunk: 1
            },
            sortIcon: {
                down: 'arrow arrow-down',
                up: 'arrow arrow-up'
            },
            perPage: '10',
            texts: {
                count: ''                                       
            }
        }
    }
}

Answer 1

使用可以使用customSorting这个

customSorting: {
    callDateTime: function (ascending) {
        return function (a, b) {
            let dateA = new Date(a.callDateTime);
            let dateB = new Date(b.callDateTime);

            if (ascending)
                return dateA >= dateB ? 1 : -1;

            return dateA <= dateB ? 1 : -1;
        }
    }
}

使日期时间列在 Vue Tables 2 中可排序

Make datetime column sortable in Vue Tables 2

momentjs

vue.js

vuejs2

vue-tables-2