[Vue] Принцип работы vuex

  1. В начале напишите и вызовите API  в компоненте : dispatch('jia',2)  , передайте ключ и параметр 2
  2. Затем для действий Actions в качестве объекта вызовите API: commit('jia',2)

  3. Затем в мутации мутация также является объектом с методом, напишите в соответствующем методе метод, этот метод содержит состояние и входящее значение, пока вы пишете state.sum+=2 в этом методе, это эквивалентно реализации операции mutate.

  4. Затем переходим к состоянию, состояние — это объект, и в нем есть разделяемые переменные, и соответствующие данные в нем модифицируются.

  5. Наконец, повторно проанализируйте компонент и обновите данные.

И действия здесь могут принимать возвращаемое значение отправки запроса Ajax.

А если вы знаете, с какими данными нужно работать, то есть когда данные доступны в компоненте, вы можете пропустить действия и сразу перейти к мутациям

Пример:

Проиллюстрировать на примере похода в ресторан поесть

Компонент эквивалентен клиенту.Приходя в ресторан, вы звоните официанту и заказываете две порции яичного жареного риса (яичный жареный рис эквивалентен типу данных, а 2 эквивалентен передаваемым данным): dispath ( 'цзя', 2)

Затем официант (действия) поможет вам заказать через приложение и заполнить содержание, что вы хотите два жареных риса с яйцами.Сообщите кухне, что вам нужно два жареных риса с яйцами: commit('jia',2 )

Затем задняя кухня (мутации) знает, что нужно две порции жареного риса с яйцом, поэтому они делают это (эквивалентно обработке наших данных : state.sum+=2)

Затем блюдо (состояние) готово и передается (рендер) гостям

А если клиент очень хорошо знаком с шеф-поваром, официант не нужен, и шеф-повар может напрямую сказать шеф-повару, что есть, что равносильно сохранению действий .

Но если покупатель заходит в магазин заказывать еду и обнаруживает, что посуду поменяли, то официант должен быть обязан сделать заказ для вас в это время, а это равносильно отправке Аякса через действия, когда ваши данные находятся на другом сервере Запрос чтобы получить соответствующие данные

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

И эти три состояния мутаций действий должны управляться складом магазина

магазин незаменим, потому что все эти апы нужно хранить

即 store.dispath, store.commit

Supongo que te gusta

Origin blog.csdn.net/qq_37308779/article/details/125903917
Recomendado
Clasificación