Problems in the use of react and redux - Codes Helper - Programming Question Answer

Problems in the use of react and redux

suppose the state in redux looks like this:

state = {
    value:"aaa",
    list:["123","321","12231"]
}

The

A component is an input,input whose value corresponds to the value in state.
B component is a list,list content that needs to be obtained based on the value value request API, such as http://api.com?query=aaa
as shown in the figure:

when the value of An is updated, the list is retrieved and component B is rendered. The normal logic is as follows:
change event sends an asynchronous action request for a new list = > Update list in redux state = > component B rendering

The problem with

now is that you cannot add code to the A component change event for some special reason. Can you listen for value changes and update list? from the row in component B?
if you get and update list, in componentWillMount , it will only be executed once when the B component is initialized, but not again when the value changes.
if you add a method to get and update list in componentWillReceiveProps , because it is asynchronous, it will result in circular requests and rendering.

ask for help!

Redux react.js javascript

Jul.18,2021

seems to have found a solution, if there is a better way, please correct!

static getDerivedStateFromProps(nextProps) {
    const { value } = nextProps;
    getAndUpdateList(value);
    //  null 
    return null;
}

so, after initialization, the component will get list , and value will also update list

when it changes.

Previous: Using the Form of ant, you want to click to get the property values of the current box, rather than the values of all input boxes.

Next: IOS APNS remote push, how to control the angle mark offline after App is dropped by kill?

How redux updates store twice in a row
update the store data twice in a row, and the second time you will get the original store such as . initState ={ a: , b: }; dispatch(setState(a,1)) dispatch(setState(b,1)) the final state result is { a: , b:1 } if you repla...

Redux react.js javascript

Feb.28,2021
Why not replace the role of redux-thunk with asynchronous dispatch (action)?
redux-thunk const fetchData = (params) => (dispatch) => { setTimeout(() => { dispatch({action: GET_DATA , payload: 111}) }) } dispatch const fetchData = (params) => ({action: GET_DATA , payload: 111}); setTimeout(() =>...

Redux react.js javascript

Mar.04,2021
In the redux document example RedditAPI, how does dispatch get into the container component AsyncApp?
when the mapDispatchToProps method is passed into the connect, the dispatch in the component is undefined; when the mapDispatchToProps method is not passed into the connect, the dispatch in the component can be obtained Why does this happen? ...

Redux react.js javascript

Mar.13,2021
Novice learning react-redux problem
redux rookie, want to write a demo, with react-redux click login to transfer data index.js: const store = createStore(reducer) ReactDOM.render( ( <Provider store = {store}> <Router> <div> ...

React-native redux react.js javascript

Mar.29,2021
How to check the form form of ant-design component Library asynchronously
problem description how ant-design component library form forms are asynchronously checked the environmental background of the problems and what methods you have tried I use the set of things that redux, does not maintain state, internally and I u...

Antd redux-form redux react.js javascript

Nov.02,2021
React redux state management issu
recently encountered a confusion as follows: suppose I get a list of original items by request, and I store it in store state = { products:[...] } in a component, users can hide items they don t care about (ps: is not deleted, similar to adding...

Vue.js redux react.js javascript

Nov.02,2021
Can react-redux be injected into the entry file like vuex and store can be accessed anywhere?
can react-redux be injected into the entry file like vuex and store can be accessed everywhere? The novice code is as follows: if I need to access the store component, I need to add < Provider store= {store} > {children} < Provider > and create c...

Redux react.js javascript

Nov.19,2021
Doubts about the reducer code of react getting started with TODO List
problem description TODO List case, delete action data of list and do not re-render UI the environmental background of the problems and what methods you have tried redux-devtools-extension plug-in, check the data changes after action is triggered,...

Redux react.js javascript

Mar.13,2022
Doubts about the reducer code of react getting started with TODO List
problem description TODO List case, delete action data of list and do not re-render UI the environmental background of the problems and what methods you have tried redux-devtools-extension plug-in, check the data changes after action is triggered,...

Redux react.js javascript

Mar.13,2022
What is the problem with redux-saga call calling methods?
problem description I have taken a look at redux-saga in the last two days. I have a question that is not very clear. Let me ask you something: authorizetoken: The Api.authorize function I use axios to return data, but since it is neither a gener...

Redux react.js javascript

Apr.13,2022

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1bef814-31c68.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1bef814-31c68.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?