Use Hooks with Redux
- Use Hooks with Redux
(1) It is the same for mapStateToProps and connect mapStateToProps to the file.
(LatLng is the file name)
(2) import React, { useEffect, useState } from ‘react’, delete import React, { Component } from ‘react’
(3) change class component to a function component and pass the props as function argument
In this case, I can just use companies instead of this.props.companies to access companies date from props.
2. Review useEffect()
useEffect(some function, [variable])
when the variable in [] changes run “some function.”
Sometimes when we want to access data from props, but the data has not been fully loaded. We will end up having errors that we cannot find the data.
We can use useEffect to solve this issue:
useEffect(function need to use data from props, [data from props])
So we will only run the function after data has loaded.
3. useState(): adding new object to array
in class component:
use prevState in useState to add new object to address array:
Resources: