我正在构建简短的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行中未定义
答案 0 :(得分:2)
尝试这样使用
${(new Date(item.date)).getDate()}
${(new Date(item.date)).getMonth()}
${(new Date(item.date)).getFullyear()}
item.date
是一个简单的字符串,没有名为getDate
,getMonth
或getFullyear
的方法。要访问这些方法,您需要一个日期对象。因此,将item.date
传递到Date
构造函数中,即可访问所有这些方法。