如何在vue js中设置默认的日期

Question

我想在日期选择器中默认设置日期。

码：

<template lang="html">
  <input type="date" v-model="date">
</template>
<script lang="js">
export default {
name: 'component',
props: [],
mounted() {

},
data() {
  return {
    // date: new Date().toJSON.split('T')[0],
    date: new Date(),
  }
},
methods: {

},
computed: {

},
               }
</script>

不幸的是，它无法正常工作，有人向我介绍了瞬间js，但我不知道我们如何使用它

Answer 1

v-model在Date输入上使用yyyy-MM-dd格式的字符串。如果您很高兴在模型中包含字符串，而不是日期对象，则只需将默认日期字符串放在date变量中，如下所示。

date : new Date().toISOString().slice(0,10)

这是一个正在运行的示例。名称已更改，以避免变量名称靠近保留关键字！

date : new Date().toISOString().slice(0,10)

vm = new Vue({
  el : '#vueRoot',
  data : { myDate : new Date().toISOString().slice(0,10) }
})

当然，如果要格式化或比较日期，则可能需要将日期作为模型中的日期对象。在这种情况下，应避免使用v-model并分别对绑定的两侧进行编码，例如this。