Question

我正在为Vuejs使用一个名为vue-good-table的表组件。它允许您使用不同的格式（如字符串，数字和日期）格式化列。

我今天的问题与日期格式有关。我能够正确地格式化列，但是，来自数据库的某些值为null，然后对于那些具有空日期的行显示标签ALLON。

有没有办法将这些列配置为可为空或以我阻止显示此消息的方式格式化它们？我宁愿把表格单元留空而不是显示那个标签。

以下示例显示了我正在描述的方案

Invalid Date

在这种情况下，我会有一个日期格式正确的字段，另一个标签为<template> <vue-good-table :columns="columns" :globalSearch="true" :paginate="true" :rows="rows"> </vue-good-table> </template> <script> export default { name: 'Table', computed: { columns() { return [{ field:"fieldA", label:"fieldA", type:"number" },{ field:"fieldB", label:"fieldB", type:"date", inputFormat: 'YYYY/MM/DD', outputFormat: 'YYYY/MM/DD' }]; } }, rows() { return [{ fieldA: 1, fieldB: null },{ fieldA: 1, fieldB: '2017/01/04' }]; } } </script>的字段

由于

- 更新 - 此问题已在最新版本中修复。

Answer 1

编辑：我刚刚意识到formatFn函数会覆盖输入和输出格式选项，因为它只会使用该函数来格式化数据。不确定它是否是最好的方法，但你可能应该自己在函数上格式化数据（或者在传递给表之前格式化数据）。这是一个使用时刻的例子：

{
    label: 'Date/Time',
    field: 'date',
    type: 'date',
    formatFn: function (value) {
        return value != null ? moment(value, 'DD/MM/YYYY HH:mm:ss').format('DD-MM-YYYY HH:mm:ss') : null
    }
}

我遇到了同样的问题，我可以使用formatFn函数（https://github.com/xaksis/vue-good-table#formatfn-function）格式化数据。

{
    label: 'Date/Time',
    field: 'date',
    type: 'date',
    dateInputFormat: 'DD/MM/YYYY HH:mm:ss',
    dateOutputFormat: 'DD-MM-YYYY HH:mm:ss',
    formatFn: function (value) {
        return value != null ? value : null
    }
}

希望这有帮助

Vue-good-table使用日期为null时的无效日期

1 个答案: