Extjs中时区和前台的时区不一致

最新推荐文章于 2025-09-23 17:10:36 发布

原创最新推荐文章于 2025-09-23 17:10:36 发布 · 2.7k 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

ExtJS 专栏收录该内容

40 篇文章

订阅专栏

本文介绍了一种在JavaScript中处理前后台服务器时区不一致问题的方法。通过自定义函数formatTime进行时间格式化，实现从UTC时间到目标时区的时间转换，并在GridPanel组件中应用该函数以正确展示时间数据。

当后台服务器的时区和前台的时区不一致，我们可以通过手动转换来达到效果。

JS时区转载函数：

function formatTime(date){
    //CST时间和UTC时差转换
    var formatPattern = 'Y-m-d H:i';
    var dateStr=date.toString();
    var position=dateStr.indexOf("UTC");
    if(position!=-1){
        return Ext.util.Format.date(date, formatPattern);
    }else{
        var vdate=new Date(date); //后台默认为格林尼治时间，该方法会默认把后台时间认为是北京时间，北京时间比格林尼治时间多14小时。
        //找出当地时间偏移值的毫秒数
        var localOffset=vdate.getTimezoneOffset()*60000;
        var utcOffset= vdate.getTime() + localOffset;
        var timezone=utcOffset-6*3600000;
        var lastDate=new Date(timezone);
        return Ext.util.Format.date(lastDate, formatPattern);
    }
}

Grid Panel 调用示例：

    function formatShowTime(value){
        return formatTime(value);
    }

    var gridPanel = Ext.create('Ext.grid.Panel', {
        id: GRID_PANLE,
        store: dataDP,
        columns: [
            { text: '请求总数', flex: 1,  dataIndex: 'totalReq' },
            { text: '成功请求', flex: 1,  dataIndex: 'successResp' },
            { text: '平均时延', flex: 1, dataIndex: 'avgDelayTime', xtype: 'numbercolumn', format:'0.000' },
            { text: '精度', flex: 1, dataIndex: 'pricision', xtype: 'numbercolumn', format:'0.000' },
            { text: '开始时间', flex: 1, dataIndex: 'beginTime', renderer: formatShowTime },
//            { text: '结束时间', flex: 1, dataIndex: 'endTime', xtype:'datecolumn', format:'Y-m-d H:i' }
            { text: '结束时间', flex: 1, dataIndex: 'endTime', renderer: formatShowTime }
        ],
        layout: 'fit'
    });

这样时间的显示就正常了，不会有时区显示异常的问题了。