- В начале напишите и вызовите API в компоненте : dispatch('jia',2) , передайте ключ и параметр 2
-
Затем для действий Actions в качестве объекта вызовите API: commit('jia',2)
-
Затем в мутации мутация также является объектом с методом, напишите в соответствующем методе метод, этот метод содержит состояние и входящее значение, пока вы пишете state.sum+=2 в этом методе, это эквивалентно реализации операции mutate.
-
Затем переходим к состоянию, состояние — это объект, и в нем есть разделяемые переменные, и соответствующие данные в нем модифицируются.
-
Наконец, повторно проанализируйте компонент и обновите данные.
И действия здесь могут принимать возвращаемое значение отправки запроса Ajax.
А если вы знаете, с какими данными нужно работать, то есть когда данные доступны в компоненте, вы можете пропустить действия и сразу перейти к мутациям
Пример:
Проиллюстрировать на примере похода в ресторан поесть
Компонент эквивалентен клиенту.Приходя в ресторан, вы звоните официанту и заказываете две порции яичного жареного риса (яичный жареный рис эквивалентен типу данных, а 2 эквивалентен передаваемым данным): dispath ( 'цзя', 2)
Затем официант (действия) поможет вам заказать через приложение и заполнить содержание, что вы хотите два жареных риса с яйцами.Сообщите кухне, что вам нужно два жареных риса с яйцами: commit('jia',2 )
Затем задняя кухня (мутации) знает, что нужно две порции жареного риса с яйцом, поэтому они делают это (эквивалентно обработке наших данных : state.sum+=2)
Затем блюдо (состояние) готово и передается (рендер) гостям
А если клиент очень хорошо знаком с шеф-поваром, официант не нужен, и шеф-повар может напрямую сказать шеф-повару, что есть, что равносильно сохранению действий .
Но если покупатель заходит в магазин заказывать еду и обнаруживает, что посуду поменяли, то официант должен быть обязан сделать заказ для вас в это время, а это равносильно отправке Аякса через действия, когда ваши данные находятся на другом сервере Запрос чтобы получить соответствующие данные
А еще официант может напомнить, когда вы заказываете два блюда и два блюда нельзя есть вместе, что равносильно ожиданию некоторого времени перед добавлением.Логические суждения нужно записывать в действия.
И эти три состояния мутаций действий должны управляться складом магазина
магазин незаменим, потому что все эти апы нужно хранить
即 store.dispath, store.commit