Как правильно его использовать в магазине Vuex?

Question

Так что в настоящее время я сталкиваюсь с проблемой логического хранения данных в Vuex.

<ul>
    <li v-for="category in sub_categories" @click="setProductCategory(category);">
        <span v-bind:class="{active: category == product.category}"></span>
        <a>{{ category.name }}</a>
    </li>
</ul>
<p class="resultObject" v-if="product.category">
    <span class="active">{{ product.category.name }}</span>
</p>

Объект category содержит много данных о категории, таких как значок, заголовок, путь и т. Д., И объект product будет отправлен на сервер, поэтому в основном ему требуется только свойство category.id.

Таким образом, мой вопрос заключается в том, должен ли я хранить весь объект категории в продукте в Vuex или просто @click="setProductCategory(category.id);", а затем делать какие-то дополнительные вещи, чтобы показать название категории?

Answer 1

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