为什么日期函数没有返回我预期的输出?

时间:2019-09-12 10:49:28

标签: javascript html css node.js axios

我正在构建简短的Web应用程序,并使用axios.js将数据发送到数据库。但是,当我从数据库中获取日期时,将呈现完整的日期,而我只希望getDate(),getMonth()和getFullYear()可以正常工作,但它们似乎并不正常。

这是Windows 7本地服务器。我已经厌倦了用不同的方式来称呼它。

function itemTemplate(item) {
  return `<li class="list-group-item list-group-item-action d-flex align-items-center justify-content-between" 
  style = "background-color: #cff0cc;
    color: #498a17;
    font-family: 'Kite One', sans-serif;">
  <span class="item-text">Date: ${item.date.getDate()} / ${item.date.getMonth() +
    1} / ${item.date.getFullyear()} - ${item.text}</span>
  <div>
  <button data-id="${
    item._id
  }" class="edit-me btn btn-primary btn-sm" style="background-color: darkgrey;border-color: grey;"><i class="fa fa-edit" style="width: 10px;"></i></button>
  <button data-id="${
    item._id
  }" class="delete-me btn btn-danger btn-sm"><i class="fa fa-minus-circle" aria-hidden="true" style="width: 10px;"></i>
  </button>
  </div>
  </li>`;
}

// Initial Page Load Render
let ourHTML = items
  .map(function(item) {
    return itemTemplate(item);
  })
  .join("");
document.getElementById("item-list").insertAdjacentHTML("beforeend", ourHTML);

// Create Feature
let createField = document.getElementById("create-field");
let createdDate = new Date();

document.getElementById("create-form").addEventListener("submit", function(e) {
  e.preventDefault();
  axios
    .post("/create-item", { text: createField.value, date: createdDate })
    .then(function(response) {
      // Create the HTML for a new item
      document
        .getElementById("item-list")
        .insertAdjacentHTML("beforeend", itemTemplate(response.data));
      createField.value = "";
      createField.focus();
    })
    .catch(function() {
      res.send("Please try again later.");
    });
});

这三个日期函数正常工作,但是错误消息显示“ item.date”在第6行中未定义

1 个答案:

答案 0 :(得分:2)

尝试这样使用

${(new Date(item.date)).getDate()}

${(new Date(item.date)).getMonth()}

${(new Date(item.date)).getFullyear()}

item.date是一个简单的字符串,没有名为getDategetMonthgetFullyear的方法。要访问这些方法,您需要一个日期对象。因此,将item.date传递到Date构造函数中,即可访问所有这些方法。