React (software): Difference between revisions

Revision as of 15:47, 15 July 2025

Revision as of 05:10, 21 July 2025

Line 200:

Flux can be considered a variant of the [[observer pattern]].<ref>{{cite web|last1=Johnson|first1=Nicholas|title=Introduction to Flux – React Exercise|url=http://nicholasjohnson.com/react/course/exercises/flux/|website=Nicholas Johnson|access-date=7 April 2018|archive-date=31 May 2022|archive-url=https://web.archive.org/web/20220531133600/http://nicholasjohnson.com/react/course/exercises/flux/|url-status=live}}</ref>

A React component under the Flux architecture should not directly modify any props passed to it, but should be passed [[callback function]]s that create ''actions'' which are sent by the dispatcher to modify the store. The action is an object whose responsibility is to describe what has taken place: for example, an action describing one user "following" another might contain a user id, a target user id, and the type <code>USER_FOLLOWED_ANOTHER_USER</code>.<ref>{{cite web|last1=Abramov|first1=Dan|title=The History of React and Flux with Dan Abramov|url=http://threedevsandamaybe.com/the-history-of-react-and-flux-with-dan-abramov/|website=Three Devs and a Maybe|access-date=7 April 2018|archive-date=19 April 2018|archive-url=https://web.archive.org/web/20180419075905/http://threedevsandamaybe.com/the-history-of-react-and-flux-with-dan-abramov/|url-status=live}}</ref> The stores, which can be thought of as models, can alter themselves in response to actions received from the dispatcher.

This pattern is sometimes expressed as "properties flow down, actions flow up". Many implementations of Flux have been created since its inception, perhaps the most well-known being [[Redux (JavaScript library)|Redux]], which features a single store, often called a [[single source of truth]].<ref>{{cite web|title=State Management Tools – Results|url=http://2016.stateofjs.com/2016/statemanagement/|website=The State of JavaScript|access-date=29 October 2021|archive-date=31 May 2022|archive-url=https://web.archive.org/web/20220531133609/http://2016.stateofjs.com/2016/statemanagement/|url-status=live}}</ref>