Let’s add two friends to the social network and navigate back to HomeScreen to see how many current friends the user has: The reducer is instrumental in keeping the current state of friends updated throughout the app as it changes.Ĭreate the FriendsReducer.js file at the root level of the project:įriendsReducer.js import, dispatch ) ) export default connect (mapStateToProps, mapDispatchToProps ) (FriendsScreen ) A reducer is a pure function that takes the previous state and an action as arguments and returns a new state. To connect Redux to your app, you will need to create a reducer and an action.įirst, you will create a friends reducer.
React native redux install#
React native redux how to#
This tutorial will use a modified version of the code in How To Use Routing with React Navigation in React Native. Step 1 - Setting Up the Project and Installing Redux It is recommended that you read this tutorial for more context around how the project works, but is not required. This tutorial builds on the topics covered in How To Use Routing with React Navigation in React Native.
A local development environment for Node.js.You will use Redux to share the state between the two screens. The application is a mock social network with a HomeScreen displaying a count of connected friends, and a FriendsScreen displaying a list of potential friends to add.
In this article, you will learn how to persist user data using Redux in a React Native application. If Redux is new to you, we recommend looking at our introduction to Redux. Redux is a predictable state container for JavaScript apps.
0 kommentar(er)
