reactjs-flux | 易学教程

Dispatching cascading/dependent async requests in Flux/React

阅读更多关于 Dispatching cascading/dependent async requests in Flux/React

I know this question has been asked more times in different flavours, but I didn’t find the "right" answer yet (maybe there just isn't one), so I’m looking for the "most Flux" one. Simple example: two components - LoginForm and Information user has to provide his/hers login information, submit the form and only after that he/she has right to "ask" for the information (this should be done automatically after login) Project structure along these lines: + actions |-- LoginAction |-- InfoAction + api |-- API + components |-- LoginForm |-- Information + stores |-- LoginStore |-- InfoStore Options:

Is it OK to call setState from within shouldComponentUpdate?

阅读更多关于 Is it OK to call setState from within shouldComponentUpdate?

问题 In response to a state change, I want to trigger another state change. Is that inherently a bad idea? The specific sort of scenario is that the component is modeled as a state machine that renders different information according to the value of this.state.current_state . But external events can prompt it to experience a state transition, via changes to it's state through a flux store. Here's a contrived scenario to get the idea across: I think the correct lifecycle method to do this would be

Redux: Opinions/examples of how to do backend persistence?

阅读更多关于 Redux: Opinions/examples of how to do backend persistence?

问题 I am wondering how folks using Redux are approaching their backend persistence. Particularly, are you storing the "actions" in a database or are you only storing the last known state of the application? If you are storing the actions, are you simply requesting them from the server, then replaying all of them when a given page loads? Couldn't this lead to some performance issues with a large scale app where there are lots of actions? If you are storing just the "current state", how are you

React router only works with root path

阅读更多关于 React router only works with root path

问题 Only root route works. /about, /home shows "Cannot GET /home" in browser. If i replace each route path with "/" then the corresponding component is rendering. But there seems to be problem when i try to render certain route eg /home. 回答1: You have to configure your server to work with Router.HistoryLocation -- that is, it needs to always serve your index.html page regardless of the route. app.get('*', function (req, res) { res.render('index'); }); Check out the docs here: React Router Docs -

Who is responsible to fetch data from server in a flux app with caching?

阅读更多关于 Who is responsible to fetch data from server in a flux app with caching?

In the flux webchat example application and in the README diagram, it seems like the action creator should retrieve the data from the server. The problem I see is that no fetch might be required if the data is already in the store. The store is the only one to know, so the action need to actually be dispatched. I think it's better to fetch dernormalized data when possible, to minimize xhr calls. If the store is denormalized e.g. MessageStore will contain all the data it needs to render Messages. Every message look like { "id": 42 "message": "Héllo, you tried reactjs-flux too. Awesome isn't it!

React + Flux: Getting initial state into a store

阅读更多关于 React + Flux: Getting initial state into a store

问题 We have recently switched over to React + Flux from Angular to build a rather complex business application. Taking the approach of having one container component that passes all state as properties down the component tree isn't a practical way to develop the app for us as the app makes use of large page-like modals. Enough state does get passed down to the modals for them to load their data into their stores. The problem I have is I need to get some initial state (passed down as props) into

How to handle one-to-many relationships in Flux stores

阅读更多关于 How to handle one-to-many relationships in Flux stores

I'm just starting to use flux (with redux for now) and am wondering how relationships are supposed to be handled. For an example we can use Trello that has boards with columns that contains cards. One approach would be to have one store/reducer for boards and have all the data in it there but that means some very fat stores since they would have to contain all the actions for columns and cards as well. Another approach i've seen is separating nested resources into for example BoardStore, ColumnStore and CardStore and use their ids as reference. Here's an example of where I am a bit confused:

How to handle non-view-altering actions in Flux & React.js

阅读更多关于 How to handle non-view-altering actions in Flux & React.js

In Flux every action should be handled by the dispatcher. What about an action that doesn't alter the view or the markup, such as "scroll this element into view"? What is the "Flux-way" of handling such a scenario? To by-pass the dispatcher? Or to handle it in the dispatcher without involving the stores or the components? Flux is really more about application state management, and is not at all about the details of what components are rendered in the view. That's the domain of React. Flux simply assumes you have some kind of reactive view layer -- usually that's React. Application state is not

Flux: How to make an action wait for a store?

阅读更多关于 Flux: How to make an action wait for a store?

问题 I'm tying myself in knots with a React problem which I'm sure can't be as difficult as it seems to me right now. I'm building a single page app against a RESTful server API that returns resources, together with links that describe what can be done with that resource. And I'm trying to ensure that my client's ajax calls only use URLs retrieved from the server in this way. So, for example, my LoggedInSessionStore contains the URL that allows me to fetch the list of all public documents, say.

Flux waitFor() and async operation, how to model.

阅读更多关于 Flux waitFor() and async operation, how to model.

I'm using pouchDB as a local database for an app. I want to query the results from PouchDB and load this into React.js. However, even though I'm using the waitFor() method the results of PouchDB query return too late. I think I don't understand the use of waitFor() correct, maybe someone can shed a light on it. I have two stores, the DbStore that retrieves data from the datbase. And the FileExplorerStore this store is used by my react components. DbStore.dispatchToken = AppDispatcher.register(function (payload) { var action = payload.action; var folder = payload.action.folder switch (action