为什么mount时原来设置的数据只加/减7

Question

这两种方法（addsevendays 和 minussevendays）附加到按钮上，我希望它们在每次单击时在日期加上或减去 7 天，但它只执行一次，即 2019-09-10 只会加上至 2019-09-17 或减至 2019-09-3。

不应该从新的状态做吗？

data: () => ({
   today: null,
}),

  addSevenDays() {
    this.today = moment().add(7, 'days').format("YYYY-MM-DD"))
    console.log(this.today)
  },      
  minusSevenDays() {
    this.today = moment().subtract(7, 'days').format("YYYY-MM-DD");
    console.log(this.today)
  }

  mounted () {
    this.today = moment().format('YYYY-MM-DD')
  }

Answer 1

因为您总是在添加函数中使用moment() 获取当前时间。

将函数中的 moment() 替换为 moment(this.today)

new Vue({
  el: '#app',
  data: {
    today: null,
  },
  methods: {
     addSevenDays() {
    this.today = moment(this.today).add(7, 'days').format("YYYY-MM-DD");
    console.log(this.today);
  },      
  minusSevenDays() {
    this.today = moment(this.today).subtract(7, 'days').format("YYYY-MM-DD");
    console.log(this.today);
  }
  },
   mounted () {
    this.today = moment().format('YYYY-MM-DD');
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

  <div id="app">
  <button @click="minusSevenDays">-</button>{{ today }}<button @click="addSevenDays">+</button>
</div>