Different events in multiple components of React produce the same action

as mentioned, I have a project with multiple components, all of which have some event handling and operations. And different action events within these components may result in the same result, including updates to the redux.

for example, I have two methods that operate on redux, asce,update, listens on one of the buttons in component A, and triggers asce (), update () when pressed. Also listen to one of the buttons in component B and trigger both methods when pressed.
doesn"t seem to be a problem at the moment, because the method is relatively simple, but if I need to do some processing and complex operations on the data before or when there are more components, it seems very complex to write, resulting in the same complicated code in multiple places.

is there any way to make code with the same function in different components be written only once?

Redux react.js

Mar.04,2021

the same code in different components, you can extract it to make a common component.
then import in different components.

these operations should be encapsulated in redux and placed in action creator or middleware. Components other than container should be completely unaware of the existence of redux and are only responsible for calling props.

Previous: The problem of adding ico icons to projects built by vue-cli

Next: Ask the seniors for advice on the nesting of tags in the vue component template

React two unrelated components how does component 2 change when component 1 changes a state
I pass values through redux scenario is when I click on the navigation bar of component 1 and refresh the ajax of component 2 is the data returned by ajax accepted by this.state.contnet what should I write? There is an urgent need for ideas. ...

Redux react.js

Feb.26,2021
What is the problem with redux-saga triggering action multiple times?
1.rootSaga.js import { fork, all } from "redux-saga effects"; import sub-sagas from submodules import { assemblyLineSaga } from "@ routes Devops AssemblyLine saga"; import { DashboardSaga } from "@ routes Devops Dashboard sa...

Redux react.js

Feb.28,2021
How to cancel loading? when an error occurs in a dva request
The loading effect is handled uniformly in dva, but loading cannot be cancelled when an error occurs in the request. What should I do? ...

Dva.js react-router4 redux react.js

Feb.28,2021
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
Basic use of redux
realize the function of adding and subtracting numbers by clicking buttons through redux. it doesn t work according to other demo. I don t know what the problem is. Please explain paste the code below. ...

Redux react.js

Mar.02,2021
How does reducer get data from the background to initialize store?
I want to write that the value of state is retrieved from the background when reducer, is initialized. How should it be implemented? whether to use redux-thunk directly dispatch a function operation interface or state? that dispat already exists when u...

Redux react.js

Mar.03,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
Should redux manage data as much as possible with redux?
as the title if only component A will request apiA to get data, and the data will only be used by that component, then whether the data should be put into redux? unrelated questions: if the request does not depend on the view content, should the req...

Redux react.js

Mar.09,2021
A problem with the Foundation of react and redux
how does it mean that return {} is an object, and then a comma separates two? Don t understand the meaning of the book ...

Redux react.js front-end javascript

Mar.09,2021
How to assign store data of redux of object type to state of react
I just started to learn js,react, and redux, is doing exercises by myself, but I want to transfer the data of store to the state, of react, but it is not successful. Please give me some guidance. what you want to do: transfer the data obtained by API...

Redux react.js

Mar.11,2021
Management of whether ui components are visible in mobx?
there is a problem with using mobx: obtain the backend interface data through @ action, then assign a value to @ observable data, and then calculate whether the modal needs to be displayed from data through @ computed modalVisiable. How can I change t...

Mobx redux react.js html5 javascript

Mar.11,2021
How does redux ensure that state changes before requesting new data?
The list is an interface, and then get the specific details according to the id of the list, and then splice the information of the list in redux state. However, if the then after the list request calls the API of details, there is no guarantee that the ...

Redux react.js

Mar.13,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
React Cannot call a class as a function
import React from react ; import ReactDOM from react-dom ; import {HashRouter as Router, Route, Switch} from react-router-dom import {createStore, applyMiddleware, compose} from redux import thunk from react-thunk import {Prov...

Redux react.js

Mar.13,2021
How does the sub-data in redux state load data asynchronously for the first time?
look at the title, I guess you don t understand, ha, I don t understand either? Let me describe it in detail this is the case. I intend to store a data in redux. This data will be used in some sub-component of the application. The default value ne...

Javascript front-end redux react.js

Mar.14,2021
On the problem of multiple console output per routes page of zuiideal open source project ant admin
namespaceperformanceconsoleperformance: each field output of the first console is empty, the second console will return the data of the first dispatch request, and the third time will return the data of two dispatch, but the network of the console on...

Redux react.js antdesign

Mar.14,2021
Problems with local storage and acquisition of redux information
how to store redux information without losing related information after page refresh, do localstorage or cookie local storage? If you are doing local storage, how do you get the relevant redux information after entering the page for the first time? Is th...

Redux react.js

Mar.18,2021
The method in Ant Design Pro Model's effects has the same name, resulting in an infinite loop. what is the reason for this?
the An and B codes of both models are the same, as follows: export default { namespace: A B , state: {} effects: { *add({payload}, {call, put}){ console.log("") yield put({ type: add , ...

Redux react.js

Mar.20,2021
How to deal with data in redux?
the specific scenarios are as follows: reducer.js const initialState = { test: [ { id: 1 show: true }, { id: 2 show: true }, { ...

Redux react.js

Mar.20,2021
I would like to ask you to use redux in react.
has been plagued by a problem, that is, the value saved by this redux, . for example, a data structure is obtained through api, but before the fetch comes down, the page will be rendered once. At this time, the data structure does not exist in redux, s...

Redux react.js php javascript

Mar.22,2021