@RuslanTimuziyev
Немного кодер

Зачем нужен Vuex, если хранилище можно эмулировать с помощью data в рутовом экземпляре?

Одно дело, когда мы используем Redux для React'a, так как в последнем в руте у нас просто компонент, который свои состояния посылает в другие компоненты через props.
Зачем использовать Vuex, если у нас и так есть централизованное хранилище в виде data в рутовом экземпляре.
Мне кажется, что Эван Ю (создатель Vue) с самого начала реализовал архитектуру Vue таким образом, чтобы у нас было общее хранилище для всех компонентов приложения.
Что скажете по этому поводу?
Еще я не понимаю, что за шум вокруг мутабельности/иммутабельности, зачем все это? Если мне нужно изменить состояние, то я просто его меняю так:

this.$root.$data.users.push({
          name: this.name,
          age: this.age
        })

Вот пример о том, что я говорю.

main.js:

import Vue from 'vue'
import data from './store.js'
import App from './App.vue';

var app = new Vue({
  components: { App },
  el: '#app',
  data,
  template: `
    <div>
      <app></app>
    </div>
  `
});

store.js:

export default {
  users: [
    { name: 'Sowyer', age: 23 },
    { name: 'Ramona', age: 45 },
  ]
};

А вот vue компонент, где мы работаем с users:

<script>
  export default {
    name: 'todo',
    data () {
      return {
        name: '',
        age: null
      }
    },
    methods: {
      createTodo() {
        this.$root.$data.users.push({
          name: this.name,
          age: this.age
        })
      }
    }
  }
</script>

<template>
  <div>
    <form>
      <input type="text" v-model="name">
      <input type="number" v-model="age">
      <button v-on:click.prevent="createTodo">Add user</button>
    </form>
    <ul>
      <li v-for="user in this.$root.$data.users">
        <p>{{user.name}} - {{user.age}}</p>
      </li>
    </ul>
  </div>
</template>
  • Вопрос задан
  • 5669 просмотров
Решения вопроса 3
Используйте глобальную дату, но помните одно, что её надо самому чистить из памяти. Ещё надо как-то придумать геттреы и сеттеры для неё. Вдруг понадобится из users достать определённых людей и это всё на разных страницах. Или например проверить авторизацию? На vuex сделать это проще, написав один геттер

Когда у вас возникнет проблемы с хранением и переполнением, то вы сами придёте к vuex.

Страница с контентом:
5a50a0ddc4f3d262866214.png
Vuex
5a50a191eea98041020431.png
Ответ написан
Комментировать
kulakoff
@kulakoff Куратор тега Vue.js
Vue.js developing
Vuex это же паттерн управления состоянием. Он дает понятные механизмы управления, по сути задает стандарт, единый подход, методологию. Это удобно, когда вы не один в проекте, когда проект развивается и растет. Без этого ваш подход через не которое время приведет к неизбежным костылям, более сложной управляемости, а еще через некоторое вы вообще перестанете понимать, что происходит)
Ну и минусы вашего подхода:
1. Жесткая связь с рутовым компонентом
2. Нет разделения на синхронные и асинхронные операции
3. Ну и вообще у вас только есть реактивность, а вуекс дает различные удобные механизмы типа модулей, наймспэйсов в них, для управления сложностью и возможностью к расширению.
Ответ написан
Комментировать
lavezzi1
@lavezzi1
В Vuex с помощью mutations можно отслеживать все изменения и аккуратно изменять нужные массивы и объекты данных. В data нет, в data все mutable, что то изменилось и уже сложно дебажить и т.д. Прочитайте в доках к Vuex часть про "Где и когда нужен Vuex".
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 2
@alexey2baranov
Низачем он не нужен. По-моему, это просто мода.

Особенно смешно читать чел написал, что там есть МОДУЛЬНОСТЬ) Вау!!! а без Вуекса- то мы все как бедалаги пишем в одном огромном файле))) И еще один, что Вуекс крут, потому что там есть геттеры) Челик, геттеры есть в любом объекте, если ты не знал. В любом объекте data можешь написать обычный ЖС геттер, поместить его в Компутед как это делает Вуекс, и он будет реактивный, если ты не знал. Или что там может любой кусок кода сломать состояние. А на бэке разрабы пишут такой код и не парятся ни о чем. Как буд-то фронтеры в другом измерении живут и у них какие-то небывалые сложности.

Код на Вуексе излишне сложен и он наоборот недебажелен из-за этого. Я на практике видел и с ним и без него. Когда какой -то кусок стора меняется, никто не смотрит по машине времмени че там в 100 коммитах менялось, это только в примерчиках можно применять. А в реале быстрее открыть Ф12 и поставить точку останова в скрипте откуда делается вызов не тай функции или не тех параметров. Так намного быстрее. А тогда зачем вообще этот геморрой с Вуексом если мошеной времени не пользоваться - не понятно.

Скорее всего Вуекс пошло от того, что Реакт оч. плохо изначально работает с мутабельными данными, для него необходим Стор. А во Вью это съобезъянничали, чтобы быть как большой брат. Мы специально на работе искали что сам Эван говорит про Вуекс, призывает ли он к нему. и нет таких интервью или статей. Только одну нашли где он отвечает на вопрос про Вуекс, и то он ответил что Вуекс не обязательно применять.
Ответ написан
uaKorona
@uaKorona
Front-End разработчик
Одно дело, когда мы используем Redux для React'a, так как в последнем в руте у нас просто компонент, который свои состояния посылает в другие компоненты через props.


Вы не поверите, но Vue - это тоже просто рутовый компонент :)
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы