Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to use action and mutations of store in vuex

2025-04-02 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)05/31 Report--

In this article, the editor introduces in detail "how to use action and mutations of store in vuex". The content is detailed, the steps are clear, and the details are handled properly. I hope that this article "how to use action and mutations of store in vuex" can help you solve your doubts.

The difference between action and mutations (this.$store.dispatch and this.$store.commit)

All call methods in vuex. One asynchronous and one synchronous.

Dispatch: contains asynchronous operations, such as submitting data to the background, written as this.$store.dispatch ('action method name', value)

Commit: synchronous operation, written as this.$store.commit ('mutations method name', value)

Action:

1. Used to change data by submitting mutation

2. It will be encapsulated as a Promise by default.

3. Can include any asynchronous operation

Mutations:

1. Change the data by submitting commit

2. it's just a simple function.

Do not use asynchronous operations, which can cause variables to be untraceable. In other words, use the function in action to call the function in mutations to manipulate the data in state asynchronously.

Usage dispatch: contains asynchronous operations

Storage:

This.$store.dispatch ('initUserInfo',friend)

Value:

This.$store.getters.userInfo;commit: synchronous operation

Storage:

This.$store.commit ('initUserInfo',friend)

Value:

This.$store.state.userInfo; instance

1 、 login.vue

2 、 user.js

3 、 login.js

What are action and mutation used to handle respectively?

Action handles asynchronous data and finally submits it to the database

Mutation is used to synchronize data for business processing (the only way to change store data in vuex is mutation)

Action submits the mutation instead of directly changing the state.

After reading this, the article "how to use action and mutations of store in vuex" has been introduced. If you want to master the knowledge of this article, you still need to practice and use it yourself to understand it. If you want to know more about related articles, please follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report