Блог

Я чувствую, что у меня проблемы с пониманием / использованием Vuex должным образом. Я понимаю основы ит между действиями, некоторые операции для выполнения, которые могут вызывать или не вызывать методы мутации, и мутации, которые непосредственно изменяют состояние.

Я борюсь с тем, как структурировать мои хранилища. Краткий контекст, я хотел бы иметь возможность создавать, обновлять записи, а также выполнять такие действия, как (комментирование, оценка, редактирование и т.д.) Для конкретной записи.

Пример структуры post

 post:
    id: UUID
    content: String
    user: [Object] <- nested
    images: [[String]]
    rating_avg: Float
    rating_count: Int
    created: Datetime
  

В настоящее время у меня есть хранилище каналов, которое содержит записи и имеет действие для выборки начальных записей и получения дополнительных записей, а также мутацию для вставки записи в состояние.

Теперь я хочу иметь возможность комментировать или оценивать пост, но где мне это сделать? Если я хочу повторно использовать хранилище каналов, мне просто нужно указать.posts.find(… postID …) затем мутацию для комментирования или оценки, создать ли мне отдельное хранилище для управления действиями, связанными с сообщениями, или я просто добавлю эту логику в сам компонент, который потенциально разделит будущие действия на сочетание нескольких компонентов и / или хранилищ.

И в качестве дополнительного замечания, обязательно ли иметь мутацию для каждого значения, которое вы хотите изменить в хранилище? Кажется очень утомительным изменять для каждого значения, такого как рейтинг, созданный, контент и т.д. И похоже, что это будет только хуже, когда данные будут вложенными.

Некоторый контекст для использования на стороне клиента:

Он действует как лента (список сообщений), вы можете видеть основную информацию, заголовок, контент, количество просмотров, рейтинг. Некоторые быстрые действия, которые вы можете выполнить, такие как оценка, комментирование.

Когда вы оцениваете что-либо, серверная часть ответит с помощью rating_avg и rating_count, которые должны обновить информацию о рейтинге в конкретном сообщении, которое было оценено.

Я обнаружил, что

   [SET_POST_RATING_AVERAGE](state, { post, rating }) {
    Vue.set(post, "rating_average", rating);
  },
  

смог сделать то, что хотел, но это не кажется правильным. По мере усложнения объекта управлять мутацией будет сложно.