Stack Overflow
Stack Overflow

Questions tagged [reactjs-flux]

Flux is the application architecture that Facebook uses for building client-side web applications with React. It complements React's composable view components by utilizing a unidirectional data flow.

Flux is the application architecture that Facebook uses for building client-side web applications with React. It complements React's composable view components by utilizing a unidirectional data flow.

Flux applications have three major parts: the dispatcher(s), the store(s), and the view(s) (React components).

Flux eschews MVC in favor of a unidirectional data flow. When a user interacts with a React view, the view propagates an action through a central dispatcher, to the various stores that hold the application's data and business logic, which updates all of the views that are affected. This works especially well with React's declarative programming style, which allows the store to send updates without specifying how to transition views between states.

###Some popular implementations of Flux

Related tags

822 questions
6
votes
2 answers

ReactJS + Flux - How to implement toasts/notifications?

I'm trying to understand Flux and Reactjs. Consider a following, very simple scenario: You have a form with few inputs. When user submits form, ActionCreator.publishAnnouncement(this.state.announcement); is called inside my form component. This…
slnowak
  • 1,839
  • 3
  • 23
  • 37
6
votes
3 answers

Flux pattern for .net

I'm learning React JS, which is a javascript library created by Facebook. For larger scale applications, it is highly recommended to use the Flux pattern/architecture. The issue is that all the tutorials for React + Flux use Node ... I find a dearth…
nanonerd
  • 1,964
  • 6
  • 23
  • 49
6
votes
1 answer

Reflux trigger won't work without a delay in init

I use Reflux, and normally I'm triggering after I made an ajax call, and it works well. For testing purposes I didn't need ajax call and I noticed that trigger won't work unless I give a min 5ms timeout. Here are working and not working example. Not…
Mïchael Makaröv
  • 1,085
  • 12
  • 21
6
votes
1 answer

Flux architecture circular dependency

I have started learning Facebook's Flux architecture. I am trying to make a simple login screen. I have followed the flux-chat sample app to create the screen. I have a problem of circular dependency between ServerActionCreator and WebAPIUtils.…
Ashok Kumar M
  • 227
  • 6
  • 10
6
votes
1 answer

Unit tests - flux and data persistency

I'm encountering a fun little problem with unit testing and the flux data stores. Since the data stores are singletons that only get instantiated once (when the module is imported) any changes you make in your unit test persist. This can (and is)…
Guy Nesher
  • 1,385
  • 2
  • 14
  • 26
6
votes
3 answers

Managing store data dependency in React/Flux

I have a web app developed using Facebook's Flux Architecture. The page has two views: one displays a list of TODO items. The second view displays a random set of TODO items. There are clearly two concerns that need to be managed by stores. The…
rafalotufo
  • 3,862
  • 4
  • 25
  • 28
5
votes
2 answers

Render Happening Before ComponentWillMount

I am trying to load some initial data before rendering my components in ReactJs. I am also using the Flux architecture for this process. Here is my container: class MemoryApp extends React.Component { constructor(props){ super(props); …
anderish
  • 1,709
  • 6
  • 25
  • 58
5
votes
1 answer

Why we decouple actions and reducers in Flux/Redux architecture?

I've been using Flux first and Redux later for a very long time, and I do like them, and I see their benefits, but one question keeps popping in my mind is: Why do we decouple actions and reducers and add extra indirections between the call that…
franleplant
  • 629
  • 1
  • 7
  • 17
5
votes
0 answers

How to use keyMirror with flow?

In my flux/react setup, I have defined ActionTypes as a keyMirror. export const ActionType = keyMirror({ START_TIMER: null, STOP_TIMER: null, PERFORM_STARTUP_CHECKS: null, SELECT_TASK_SERVICE:null, ADD_TASK: null, CLEAR_ALL_TASKS:…
shashi
  • 4,616
  • 9
  • 50
  • 77
5
votes
2 answers

Is it sane to use React `context` to access model mutators in a Flux-less app?

I'm starting a new React app and, seeing all the news in the ecosystem, I want to go slow and actually consider my choices, starting with just React/Webpack/Babel, and introducing more. The first of these choices is whether to use Flux or not (more…
Ronan Jouchet
  • 1,303
  • 1
  • 15
  • 28
5
votes
1 answer

React Native: onPress on component doesn't function

So I am using react-native-router-flux for my navigation in my ReactJS app but I am having difficulties using it with components. For example the following code snippet works perfectly by pushing the next page when clicking the links. export default…
Joseph An
  • 822
  • 1
  • 7
  • 19
5
votes
1 answer

When to use Flux (etc.) with React?

I've been working on a fairly simple React app as a learning process, and want to begin incorporating Flux (or, more likely, Redux) to continue the education. The code to implement a Flux-alike solution seems fairly straightforward, but I'm a little…
user1381745
  • 3,850
  • 2
  • 21
  • 35
5
votes
2 answers

React - appending an empty row to a table

I am currently building an application that renders a table but in the first instance the only thing that renders are the column headers. What I would like to know is how I would then go about giving a user the choice to add a row with no data that…
BeeNag
  • 1,764
  • 8
  • 25
  • 42
5
votes
1 answer

React: Can the global state of the stores be manipulated in the browser?

A fun curiosity as I build my React application: I notice how in the browser we can play with the client-code and/or resources. (e.g change css, change html, change a js variable). Does that mean we can also manipulate the global state of the stores…
Nick Pineda
  • 6,354
  • 11
  • 46
  • 66
5
votes
0 answers

How to get a reference to nested child in React

My app structure is as follows (HighOrderComponent is Alt's AltContainer wrapper): I need to expose a collectData()…
Shahar
  • 478
  • 5
  • 17
1 2 3
…
54 55