时间戳

首页 > 解决方案 > 如何比较 Vuejs 中的日期？

javascript - 如何比较 Vuejs 中的日期？

问题描述

嗨，我正在尝试制作一个图书馆/书籍跟踪应用程序，它可以跟踪日期并返回状态，如返回或丢失等。我需要在我的应用程序中比较日期，但我在 vuejs 中找不到如何使用，请你帮忙谢谢。

<html>
<head>
    <meta charset=utf-8>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="newVue.js"></script>
</head>
<body>
    <div id="app">
        <input type="text" v-model="message" required placeholder="Enter Name">
        <input type="date" v-model="enterdate" placeholder="Enter Date">
        <table border="1" v-for="item in items">
            <tr>
                <td>{{item.name}}</td>
                <td>{{item.date}}</td>
            </tr>
        </table>
        <button @click="addRow">Add</button>
    </div>
</body>


window.addEventListener('load',()=>{
window.vue = new Vue({
    el: '#app',
    data: {
        message:'',
        enterdate:'',
        items:[{
            name:'',
        }]
    },
    methods: {
        addRow() {
            this.items.push({
                name: this.message,
                date: this.enterdate,


           })
        },
    }
})

})

标签： javascriptvue.js

解决方案

看起来您将日期表示为字符串。然后要比较它，您需要先解析它。我建议您为此使用一些现有的库。http://momentjs.com/就是一个很好的例子。

然后你会做类似的事情：

dateA = moment(itemA.date, "MM-DD-YYYY"); // replace format by your one
dateB = moment(itemB.date, "MM-DD-YYYY");

if (dateA.diff(dateB) > 0) {
     // do something if A is later than B
} else {
     // do something if B is later that A
}

推荐阅读