页面上的数据与控制台中的数据不同答案

【问题标题】：Data on page is different than data in console页面上的数据与控制台中的数据不同
【发布时间】：2020-12-02 22:50:51
【问题描述】：

我正在执行 GET 请求以在页面上显示信息 --- 在我的控制台中，我可以看到 _data.Created 的日期是正确的，但在页面本身上显示的是今天的 12 月 2 日日期。我使用moment.js 来格式化创建日期。

我最近所做的更改是删除了以前位于 <a> 标记之间的 <p> 标记，但我看不出这会如何与日期混淆。另外，我不记得过去看到过这个错误，但我可能错过了它。

关于发生了什么以及如何解决它的任何想法？将不胜感激。

JS：

async function displayAnnouncements() {
    axios.get(`${_something}/_api/lists/GetByTitle('someName')/Items?$select=ID,Title,Body,Created,Link&$orderby=Created%20desc&$top=4`, restHeaders)
         .then(resp => {

            let _data = resp.data.d.results;
            let _newDate = moment(_data.Created).utc().format("MMMM D, YYYY");

            console.log(_data)

                _data.slice(0, 4).forEach(m => {
                    const itemLink = $(`<a href="#close" data-toggle="modal" data-target="#bkEvts-${m.ID}" class="cont_evts-link" title="View Announcement">
                        <b>${m.Title}</b> - <i>${_newDate}</i>
                    </a><br>`)

// etc

这是控制台和页面：

【问题讨论】：

_data 是一个数组。因此，moment(_data.Created) 将传递一个无效的日期并退回到今天。
Here's what you need to know. 是的，控制台中的对象显示了对象的最后状态，所以你可能想console.log(JSON.stringify(_data));。

标签： javascript jquery get axios momentjs

【解决方案1】：

_data 是一个数组。 _data.Created 将导致 undefined。所以你将undefined 传递给moment，这将回到今天。

改为格式化数组中每个项目的日期。

async function displayAnnouncements() {
    const resp = await axios.get(`${_something}/_api/lists/GetByTitle('someName')/Items?$select=ID,Title,Body,Created,Link&$orderby=Created%20desc&$top=4`, restHeaders)
    let _data = resp.data.d.results;
    _data.slice(0, 4).forEach(m => {
        let _newDate = moment(m.Created).utc().format("MMMM D, YYYY");
        const itemLink = $(
            `<a href="#close" data-toggle="modal" data-target="#bkEvts-${m.ID}" class="cont_evts-link" title="View Announcement">
                <b>${m.Title}</b> - <i>${_newDate}</i>
            </a><br>`
        );
    });
};

【讨论】：