javascript - Vuex getter 不会更新

Question

我正在使用日期选择器来设置一个 moment.js 日期，该日期正在我的 Vuex 商店中设置:

存储状态:

const state = {
    arrival: '',
    departure: ''
}

setter/getter :

const getters = {
    arrival: state => state.arrival,
    departure: state => state.departure,

    prettyArrival: (state) => {
        if (state.arrival instanceof moment) {
            return state.arrival.format(state.prettyFormat);
        }

        return '';
    }
}

我的 vuex 存储正在正确更新到达状态(这是一个 moment.js 对象)，因为我可以清楚地看到显示更新和原始状态发生变化的开发工具。

但是 prettyArrival 没有正确更新。当到达从空字符串变为 moment.js 对象时，它只会被设置一次。

我的 arrival getter 在 devtools 中显示如下:

arrival:"2017-07-21T09:15:53.770Z"

当我记录它时，我得到了 moment.js 对象，尽管它似乎包含 reactiveGetters 和 reactiveSetters 所以 react 似乎到位。

我设置 setter/getter 的方式有问题还是这里有其他问题？

欢迎提供任何提示，如果您需要更多信息，请告诉我。

Answer 1

解决方案在于这个答案:

Why does vue.js not update the dom with datepicker using moment.js

我认为情况并非如此，因为我仍然有一些输入正在正确更新。我是如何做到这一点的，这仍然是我需要解开的谜。

moment.js 实例不是响应式(Reactive)的，因此您可以通过将 moment.js 实例放入构造函数来修复它，并在每次设置时创建一个新实例，如下所示:

moment(this.currentDate)

this.currentDate 在这种情况下是一个 moment.js 实例。