Как использовать пользовательские методы объекта с Vuex?

Question

У меня есть несколько пользовательских объектов js, где я инкапсулировал игольную логику.Итак, эти объекты вообще не имеют отношения к vuex, что-то вроде этого:

export default class Property {
   constructor(object) {
      // some logic
   }
   addChild(property) {
      // some logic
   }
}

Кроме того, в моем компоненте vue есть кнопка, которая запускает метод vue:

methods: {
    addItem() {
        this.property.addChild();
    },
},

И есть проблема: this.property - это объект из магазина vuex.Поэтому, когда я вызываю метод таким образом, я получаю ошибку vue:

Error: [vuex] Do not mutate vuex store state outside mutation handlers.

Да, я понимаю, чего хочет Vue.Но для меня более понятно заключать в иглы некоторые сложные логические схемы.Также я хочу использовать vuex для глобального состояния приложения.

Итак, не могли бы вы поделиться опытом работы с методами vuex и пользовательскими объектами?

Answer 1

Если вы хотите использовать vuex, вы просто должны использовать мутацию, чтобы изменить его состояния. Итак, в функции addChild объекта Property где бы вы изменили состояние, я полагаю, вы бы сделали это как

Store.state.xxx = 'new'

Вместо этого вы называете мутацию как

Store.commit('alterState')

Нет большой разницы с точки зрения сложности, верно?