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?

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.

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-1b2bd12-2babe.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-1b2bd12-2babe.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?