Ext-js 中的自定义渲染器 - Bryntum/ExtJs UTC 日期问题

Question

我正在尝试将 自定义渲染器 添加到 Bryntum Ext 甘特图。

我有在本地时区显示的日期，但我希望在 UTC 日期中显示它们，因为这是数据源用来向用户显示日期的内容（它与浏览器时区无关）源应用程序。

这里的帖子引导我朝着正确的方向前进（根据我的测试，这似乎是我所需要的）：Why does ExtJS subtract a day when formatting a date?

如何在自定义渲染器中实现链接解决方案？

---

我试过了，但该列是空白的：

{
    xtype:'startdatecolumn',
    sortable: false,
    text: 'Start',
    dataIndex: 'StartDate',
    renderer: function (v, m, r) {
        return Ext.util.Format.date(Ext.Date.parse(v, "Y-m-d"), "m-d-Y");
    }
}

也试过了，该列是空白的：

{
    xtype:'startdatecolumn',
    sortable: false,
    text: 'Start',
    dataIndex: 'StartDate',
    renderer: function (v) {
        var dt = Ext.Date.parse(v, "Y-m-d");
        Ext.util.Format.date(dt, "m-d-Y");
        return dt;
    }
}

使用这种格式，它以本地时区显示日期（不正确，除非设置为 UTC）。

{   
    xtype:'enddatecolumn',
    dataIndex: 'EndDate',
    sortable: false,
    text: 'End'
}

---

Bryntum 色谱柱示例

 columns : [
            {
                xtype : 'treecolumn',
                header: 'Tasks',
                sortable: true,
                dataIndex: 'Name',
                width: 200,
                field: {
                    allowBlank: false
                },
                renderer : function(v, meta, r) {
                    if (!r.data.leaf) meta.tdCls = 'sch-gantt-parent-cell';

                    return v;
                }
            },
            {
                xtype : 'startdatecolumn'
            },
            {
                //hidden : true,
                xtype : 'enddatecolumn'
            },

Answer 1

使用此功能修复：

function niceDate (v, m, r) {
            var dt =    padStr(1 + v.getMonth()) + 
                        '-' +
                        padStr(v.getDate()) +
                        '-' +
                        padStr(v.getFullYear());
            return dt;
           }

function padStr(i) {
    return (i < 10) ? "0" + i : "" + i;
}

在列渲染器中：

                   {
                    xtype:'startdatecolumn',
                    sortable: false,
                    text: 'Start',
                    dataIndex: 'StartDate',
                    renderer: niceDate
                    }

在解析 xml 时，我使用带有以下时间戳的 switch 函数：

case 'timestamp':
    if(!empty(v))
    v = new Date(parseInt(v));
    break;

这似乎可靠地将“日期”对象提供给 ext.js，并使用渲染器渲染列以匹配我们的源日期格式。