[addons-react] ConnectToStore called multiple time #287

Wykks · 2015-10-20T14:06:42Z

Following the doc : http://fluxible.io/addons/connectToStores.html
connectToStores is listening to the stores for updates. It should only listen to the array of store passed in arguments, no ?

Using the generator-fluxible code base, when I do something like this :

@connectToStores([ArticlesStore], (context, props) => {
    debug('ConnectToStore called');
    const articleStore = context.getStore(ArticlesStore);
    const slug = props.currentRoute.get('params').get('slug');
    return {
        article: articleStore.getSingleArticle(slug)
    };
})

connectToStores is called 3 times :
The expected one :

Dispatchr:Action executing handler for ArticlesStore
ConnectToStore called

And two others times afterwards :

Dispatchr:Action executing handler for RouteStore
ConnectToStore called
[...]
Dispatchr:Action executing handler for ApplicationStore
browser.js:112 Dispatchr:Action waiting on function StaticRouteStore() {
        RouteStore.apply(this, arguments);
    }
ConnectToStore called

Why RouteStore and ApplicationStore changes are firing this ConnectToStore ? Am I missing something here ?

Thanks ! :)

The text was updated successfully, but these errors were encountered:

mridgway · 2015-10-20T18:14:08Z

Do you have store connections higher up in your component hierarchy? All updates will cascade from the top down unless you define shouldComponentUpdate somewhere.

Wykks · 2015-10-23T11:31:15Z

I see. The Application component does have a connectToStores.
So it means that every component added will behave like that (3 call to connectToStores) unless I define shouldComponentUpdate.
Is shouldComponentUpdate called before connectToStores ? How can I make it so it will only call connectToStores once in this context ?

mridgway · 2015-10-28T00:27:46Z

shouldComponentUpdate gets called after connectToStores since it happens after a setState call.

It looks like in your case it's a different connectToStores being called each time. Internally, fluxible-router is using connectToStores as well.

Each of the connectToStores should be called only once.

Wykks · 2015-10-29T16:28:23Z

Okay about shouldComponentUpdate :)
But about connectToStores being called only once, something is not right then. In my example, I used debug('ConnectToStore called'); to see when my connectToStores is called, we can clearly see that he's being called right after handler for RouteStore and handler for ApplicationStore.
I'm calling emitChange() only once, right after my route action is done.

mridgway · 2015-10-29T18:08:27Z

Yeah, that's odd then. Can you console.trace() to see where it's being called from?

Wykks · 2015-10-30T15:21:28Z

Actually, my connectToStores is called 4 times.

I start an action in the route config (simplified a bit here) :

article: {
    path: '/:slug',
    method: 'get',
    handler: require('../pages/Article'),
    action: function (context, payload, done) {
        const articleSlug = payload.get('params').get('slug');
        context.executeAction(retrieveArticle, { slug: articleSlug }, done);
    }

The action (again, simplified) :

export default function(context, payload, done) {
    context.service.read('article', payload, {}, (err, data) => {
        context.dispatch('RECEIVE_ARTICLE_SUCCESS', data);
        done();
    });
}

The store :

_handleGetArticleSuccess(data) {
    data.date = new Date(data.date);
    this.articles = this.articles.set(data.slug, Immutable.fromJS(data))
                                .sort(this._articleSort);
    this.emitChange();
}

I took these trace right after I switch to another route (/cupyou in this case) :

NavLink dispatchNavAction: action=NAVIGATE +3s undefined undefined Object {slug: "cupyou"}
Fluxible:Context Executing action navigateAction with payload +2ms Object {type: "click", url: "/cupyou", preserveScrollPosition: undefined, params: Object}
navigateAction dispatching NAVIGATE_START +3ms Object {type: "click", url: "/cupyou", preserveScrollPosition: undefined, params: Object}
Dispatchr:DispatcherContext dispatching NAVIGATE_START +1ms Object {type: "click", url: "/cupyou", preserveScrollPosition: undefined, params: Object}
Dispatchr:Action executing handler for RouteStore +0ms
orennesginal ConnectToStore [ArticlesStore] called  +11ms
console.trace() <-- TRACE 1
RoutingContainer component did update +19ms null Object {context: Object, currentNavigate: Object, currentNavigateError: null, isNavigateComplete: false, currentRoute: Object}
RoutingContainer on click navigation, reset scroll position to (0, 0) +2ms
Dispatchr:DispatcherContext finished NAVIGATE_START +1ms
navigateAction executing +0ms Object {type: "click", url: "/cupyou", preserveScrollPosition: undefined, params: Object}
navigateAction executing route action +0ms
Fluxible:Context Executing action navigateAction.action with payload +1ms Object {size: 10, _root: BitmapIndexedNode, __ownerID: undefined, __hash: undefined, __altered: false}
Fluxible:Context Executing action navigateAction. with payload +1ms Object {slug: "cupyou"}
FetchrClient Executing request article.read with params Object and body null +1ms
Fetcher:defaultConstructGetUri constructed get uri: +2ms /api/article;slug=cupyou
Dispatchr:DispatcherContext dispatching RECEIVE_ARTICLE_SUCCESS +904ms Object {ID: 1304, title: "Cupÿou", status: "publish", type: "post", author: Object…}
Dispatchr:Action executing handler for ArticlesStore +1ms
orennesginal ConnectToStore [ArticlesStore] called  +6ms
console.trace() <-- TRACE 2
Dispatchr:DispatcherContext finished RECEIVE_ARTICLE_SUCCESS +6ms
Dispatchr:DispatcherContext dispatching NAVIGATE_SUCCESS +9ms Object {size: 10, _root: BitmapIndexedNode, __ownerID: undefined, __hash: undefined, __altered: false}
Dispatchr:Action executing handler for RouteStore +2ms
orennesginal ConnectToStore [ArticlesStore] called  +8ms
console.trace() <-- TRACE 3
RoutingContainer component did update +8ms null Object {context: Object, currentNavigate: Object, currentNavigateError: null, isNavigateComplete: true, currentRoute: Object}
Dispatchr:Action executing handler for ApplicationStore +1ms
Dispatchr:Action waiting on function StaticRouteStore() {
        RouteStore.apply(this, arguments);
    } +1ms
orennesginal ConnectToStore [ArticlesStore] called  +14ms
console.trace() <-- TRACE 4
Dispatchr:DispatcherContext finished NAVIGATE_SUCCESS +8ms

TRACE 1

(anonymous function)    @   Article.js:93
React.createClass.getStateFromStores    @   connectToStores.js:36
(anonymous function)    @   makeAssimilatePrototype.js:15
getInitialState @   connectToStores.js:19
(anonymous function)    @   makeAssimilatePrototype.js:15
Constructor @   ReactClass.js:708
ReactCompositeComponentMixin.mountComponent @   ReactCompositeComponent.js:148
wrapper @   ReactPerf.js:66
ReactReconciler.mountComponent  @   ReactReconciler.js:37
ReactMultiChild.Mixin._mountChildByNameAtIndex  @   ReactMultiChild.js:474
ReactMultiChild.Mixin._updateChildren   @   ReactMultiChild.js:378
ReactMultiChild.Mixin.updateChildren    @   ReactMultiChild.js:326
ReactDOMComponent.Mixin._updateDOMChildren  @   ReactDOMComponent.js:869
ReactDOMComponent.Mixin.updateComponent @   ReactDOMComponent.js:701
ReactDOMComponent.Mixin.receiveComponent    @   ReactDOMComponent.js:646
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactChildReconciler.updateChildren @   ReactChildReconciler.js:84
ReactMultiChild.Mixin._reconcilerUpdateChildren @   ReactMultiChild.js:216
ReactMultiChild.Mixin._updateChildren   @   ReactMultiChild.js:351
ReactMultiChild.Mixin.updateChildren    @   ReactMultiChild.js:326
ReactDOMComponent.Mixin._updateDOMChildren  @   ReactDOMComponent.js:869
ReactDOMComponent.Mixin.updateComponent @   ReactDOMComponent.js:701
ReactDOMComponent.Mixin.receiveComponent    @   ReactDOMComponent.js:646
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactCompositeComponentMixin._updateRenderedComponent   @   ReactCompositeComponent.js:562
ReactCompositeComponentMixin._performComponentUpdate    @   ReactCompositeComponent.js:544
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:473
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.receiveComponent   @   ReactCompositeComponent.js:405
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactCompositeComponentMixin._updateRenderedComponent   @   ReactCompositeComponent.js:562
ReactCompositeComponentMixin._performComponentUpdate    @   ReactCompositeComponent.js:544
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:473
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.receiveComponent   @   ReactCompositeComponent.js:405
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactCompositeComponentMixin._updateRenderedComponent   @   ReactCompositeComponent.js:562
ReactCompositeComponentMixin._performComponentUpdate    @   ReactCompositeComponent.js:544
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:473
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.receiveComponent   @   ReactCompositeComponent.js:405
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactCompositeComponentMixin._updateRenderedComponent   @   ReactCompositeComponent.js:562
ReactCompositeComponentMixin._performComponentUpdate    @   ReactCompositeComponent.js:544
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:473
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.receiveComponent   @   ReactCompositeComponent.js:405
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactCompositeComponentMixin._updateRenderedComponent   @   ReactCompositeComponent.js:562
ReactCompositeComponentMixin._performComponentUpdate    @   ReactCompositeComponent.js:544
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:473
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.performUpdateIfNecessary   @   ReactCompositeComponent.js:421
ReactReconciler.performUpdateIfNecessary    @   ReactReconciler.js:102
runBatchedUpdates   @   ReactUpdates.js:129
Mixin.perform   @   Transaction.js:136
Mixin.perform   @   Transaction.js:136
assign.perform  @   ReactUpdates.js:86
flushBatchedUpdates @   ReactUpdates.js:147
wrapper @   ReactPerf.js:66
Mixin.closeAll  @   Transaction.js:202
Mixin.perform   @   Transaction.js:149
ReactDefaultBatchingStrategy.batchedUpdates @   ReactDefaultBatchingStrategy.js:62
enqueueUpdate   @   ReactUpdates.js:176
enqueueUpdate   @   ReactUpdateQueue.js:24
ReactUpdateQueue.enqueueSetState    @   ReactUpdateQueue.js:190
ReactComponent.setState @   ReactComponent.js:64
onStoreChange   @   connectToStores.js:40
emit    @   index.js:110
emitChange  @   BaseStore.js:72
createStore._handleNavigateStart    @   RouteStore.js:45
callHandler @   Action.js:67
handlersEach    @   Action.js:45
execute @   Action.js:44
dispatch    @   DispatcherContext.js:88
navigateAction  @   navigateAction.js:15
(anonymous function)    @   FluxibleContext.js:92
onNextTick  @   main.js:64
Item.run    @   browser.js:64
drainQueue  @   browser.js:34

TRACE 2

(anonymous function)    @   Article.js:93
React.createClass.getStateFromStores    @   connectToStores.js:36
(anonymous function)    @   makeAssimilatePrototype.js:15
onStoreChange   @   connectToStores.js:40
(anonymous function)    @   makeAssimilatePrototype.js:15
emit    @   index.js:89
emitChange  @   BaseStore.js:72
_handleGetArticleSuccess    @   ArticlesStore.js:67
callHandler @   Action.js:67
handlersEach    @   Action.js:45
execute @   Action.js:44
dispatch    @   DispatcherContext.js:88
(anonymous function)    @   retrieveArticle.js:21
onNextTick  @   main.js:62
Item.run    @   browser.js:64
drainQueue  @   browser.js:34

TRACE 3 (not exactly the same a 1)

(anonymous function)    @   Article.js:93
React.createClass.getStateFromStores    @   connectToStores.js:36
(anonymous function)    @   makeAssimilatePrototype.js:15
componentWillReceiveProps   @   connectToStores.js:32
(anonymous function)    @   makeAssimilatePrototype.js:15
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:458
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.receiveComponent   @   ReactCompositeComponent.js:405
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactChildReconciler.updateChildren @   ReactChildReconciler.js:84
ReactMultiChild.Mixin._reconcilerUpdateChildren @   ReactMultiChild.js:216
ReactMultiChild.Mixin._updateChildren   @   ReactMultiChild.js:351
ReactMultiChild.Mixin.updateChildren    @   ReactMultiChild.js:326
ReactDOMComponent.Mixin._updateDOMChildren  @   ReactDOMComponent.js:869
ReactDOMComponent.Mixin.updateComponent @   ReactDOMComponent.js:701
ReactDOMComponent.Mixin.receiveComponent    @   ReactDOMComponent.js:646
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactChildReconciler.updateChildren @   ReactChildReconciler.js:84
ReactMultiChild.Mixin._reconcilerUpdateChildren @   ReactMultiChild.js:216
ReactMultiChild.Mixin._updateChildren   @   ReactMultiChild.js:351
ReactMultiChild.Mixin.updateChildren    @   ReactMultiChild.js:326
ReactDOMComponent.Mixin._updateDOMChildren  @   ReactDOMComponent.js:869
ReactDOMComponent.Mixin.updateComponent @   ReactDOMComponent.js:701
ReactDOMComponent.Mixin.receiveComponent    @   ReactDOMComponent.js:646
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactCompositeComponentMixin._updateRenderedComponent   @   ReactCompositeComponent.js:562
ReactCompositeComponentMixin._performComponentUpdate    @   ReactCompositeComponent.js:544
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:473
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.receiveComponent   @   ReactCompositeComponent.js:405
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactCompositeComponentMixin._updateRenderedComponent   @   ReactCompositeComponent.js:562
ReactCompositeComponentMixin._performComponentUpdate    @   ReactCompositeComponent.js:544
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:473
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.receiveComponent   @   ReactCompositeComponent.js:405
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactCompositeComponentMixin._updateRenderedComponent   @   ReactCompositeComponent.js:562
ReactCompositeComponentMixin._performComponentUpdate    @   ReactCompositeComponent.js:544
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:473
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.receiveComponent   @   ReactCompositeComponent.js:405
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactCompositeComponentMixin._updateRenderedComponent   @   ReactCompositeComponent.js:562
ReactCompositeComponentMixin._performComponentUpdate    @   ReactCompositeComponent.js:544
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:473
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.receiveComponent   @   ReactCompositeComponent.js:405
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactCompositeComponentMixin._updateRenderedComponent   @   ReactCompositeComponent.js:562
ReactCompositeComponentMixin._performComponentUpdate    @   ReactCompositeComponent.js:544
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:473
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.performUpdateIfNecessary   @   ReactCompositeComponent.js:421
ReactReconciler.performUpdateIfNecessary    @   ReactReconciler.js:102
runBatchedUpdates   @   ReactUpdates.js:129
Mixin.perform   @   Transaction.js:136
Mixin.perform   @   Transaction.js:136
assign.perform  @   ReactUpdates.js:86
flushBatchedUpdates @   ReactUpdates.js:147
wrapper @   ReactPerf.js:66
Mixin.closeAll  @   Transaction.js:202
Mixin.perform   @   Transaction.js:149
ReactDefaultBatchingStrategy.batchedUpdates @   ReactDefaultBatchingStrategy.js:62
enqueueUpdate   @   ReactUpdates.js:176
enqueueUpdate   @   ReactUpdateQueue.js:24
ReactUpdateQueue.enqueueSetState    @   ReactUpdateQueue.js:190
ReactComponent.setState @   ReactComponent.js:64
onStoreChange   @   connectToStores.js:40
emit    @   index.js:110
emitChange  @   BaseStore.js:72
createStore._handleNavigateSuccess  @   RouteStore.js:49
callHandler @   Action.js:67
handlersEach    @   Action.js:45
execute @   Action.js:44
dispatch    @   DispatcherContext.js:88
(anonymous function)    @   navigateAction.js:60
onNextTick  @   main.js:62
Item.run    @   browser.js:64
drainQueue  @   browser.js:34

TRACE 4 (again a bit different)

(anonymous function)    @   Article.js:93
React.createClass.getStateFromStores    @   connectToStores.js:36
(anonymous function)    @   makeAssimilatePrototype.js:15
componentWillReceiveProps   @   connectToStores.js:32
(anonymous function)    @   makeAssimilatePrototype.js:15
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:458
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.receiveComponent   @   ReactCompositeComponent.js:405
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactChildReconciler.updateChildren @   ReactChildReconciler.js:84
ReactMultiChild.Mixin._reconcilerUpdateChildren @   ReactMultiChild.js:216
ReactMultiChild.Mixin._updateChildren   @   ReactMultiChild.js:351
ReactMultiChild.Mixin.updateChildren    @   ReactMultiChild.js:326
ReactDOMComponent.Mixin._updateDOMChildren  @   ReactDOMComponent.js:869
ReactDOMComponent.Mixin.updateComponent @   ReactDOMComponent.js:701
ReactDOMComponent.Mixin.receiveComponent    @   ReactDOMComponent.js:646
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactChildReconciler.updateChildren @   ReactChildReconciler.js:84
ReactMultiChild.Mixin._reconcilerUpdateChildren @   ReactMultiChild.js:216
ReactMultiChild.Mixin._updateChildren   @   ReactMultiChild.js:351
ReactMultiChild.Mixin.updateChildren    @   ReactMultiChild.js:326
ReactDOMComponent.Mixin._updateDOMChildren  @   ReactDOMComponent.js:869
ReactDOMComponent.Mixin.updateComponent @   ReactDOMComponent.js:701
ReactDOMComponent.Mixin.receiveComponent    @   ReactDOMComponent.js:646
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactCompositeComponentMixin._updateRenderedComponent   @   ReactCompositeComponent.js:562
ReactCompositeComponentMixin._performComponentUpdate    @   ReactCompositeComponent.js:544
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:473
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.receiveComponent   @   ReactCompositeComponent.js:405
ReactReconciler.receiveComponent    @   ReactReconciler.js:87
ReactCompositeComponentMixin._updateRenderedComponent   @   ReactCompositeComponent.js:562
ReactCompositeComponentMixin._performComponentUpdate    @   ReactCompositeComponent.js:544
ReactCompositeComponentMixin.updateComponent    @   ReactCompositeComponent.js:473
wrapper @   ReactPerf.js:66
ReactCompositeComponentMixin.performUpdateIfNecessary   @   ReactCompositeComponent.js:421
ReactReconciler.performUpdateIfNecessary    @   ReactReconciler.js:102
runBatchedUpdates   @   ReactUpdates.js:129
Mixin.perform   @   Transaction.js:136
Mixin.perform   @   Transaction.js:136
assign.perform  @   ReactUpdates.js:86
flushBatchedUpdates @   ReactUpdates.js:147
wrapper @   ReactPerf.js:66
Mixin.closeAll  @   Transaction.js:202
Mixin.perform   @   Transaction.js:149
ReactDefaultBatchingStrategy.batchedUpdates @   ReactDefaultBatchingStrategy.js:62
enqueueUpdate   @   ReactUpdates.js:176
enqueueUpdate   @   ReactUpdateQueue.js:24
ReactUpdateQueue.enqueueSetState    @   ReactUpdateQueue.js:190
ReactComponent.setState @   ReactComponent.js:64
onStoreChange   @   connectToStores.js:40
emit    @   index.js:89
emitChange  @   BaseStore.js:72
(anonymous function)    @   ApplicationStore.js:45
waitFor @   Action.js:96
waitFor @   DispatcherContext.js:150
handlePageTitle @   ApplicationStore.js:42
callHandler @   Action.js:67
handlersEach    @   Action.js:45
execute @   Action.js:44
dispatch    @   DispatcherContext.js:88
(anonymous function)    @   navigateAction.js:60
onNextTick  @   main.js:62
Item.run    @   browser.js:64
drainQueue  @   browser.js:34

Sorry for the bad readability... And thank you for your time ! :)

mridgway · 2015-10-30T18:22:38Z

So it looks like this is the flow:

RouteStore.NAVIGATE_START causes new component to render and calls getInitialState
ArticleStore. RECEIVE_ARTICLE_SUCCESS triggers change event
RouteStore.NAVIGATE_SUCCESS triggers componentWillReceiveProps from parent being updated
ApplicationStore.NAVIGATE_SUCCESS triggers a second componentWillReceiveProps from parent being updated

So it seems like componentWillReceiveProps causing state changes is the biggest culprit here. In theory, the state could be based on props which would require that we run this hook, but it could be optimized to not call connectToStores if the state is not based on any props.

Perhaps we can provide an option to flag certain props as influential to state or a hook to return before calling connectToStores that takes in props: shouldUpdateState(props).

Wykks · 2015-11-01T14:08:17Z

(Comment edited)
Actually the first one is expected too, because it's the initialState and can be useful sometimes. The "extra" calls are 3 and 4.

pablolmiranda · 2015-11-01T15:04:08Z

ConnectToStores encapsulates all the logic of binding with the stores, it is a central point for this logic. In this case, why not change the connectToStores to bind with the Dispatcher and change the Dispatcher logic to only trigger one change per action dispatched? Is it possible?

Wykks · 2015-11-01T23:17:42Z

In theory, the state could be based on props which would require that we run this hook, but it could be optimized to not call connectToStores if the state is not based on any props.

In which case you would base the state on props ? I never used the props arg from getStateFromStores.

@pablolmiranda connectToStore listen to emitChange called from the store, which already trigger one change. The store must be the one triggering connectToStore, after the changes are actually made in the store. The dispatcher isn't aware of that.

mridgway · 2015-11-02T00:40:54Z

In some cases you may fetch data from your store based on the props that were passed in to a component.

For example, an ArticleComponent that takes in an identifier for which article to display. It could call ArticleStore.getArticle(id) to get the correct data. If the props change in this case, you would want to make sure that the state of the component changes to the new article.

It's probably more often that you wouldn't want this, so maybe we should optimize for that path first and provide a way to trigger changes based on props. This would potentially break compatibility though.

Wykks · 2015-11-02T00:59:24Z

Oh my... Sorry I'm tired, I should think more before writing anything.. I'm actually using that exact props param in my first post..... (I was getting the id directly from the store, before doing this).
shouldUpdateState seems to be a good way to solve that then, in order to not call connectToStore when NAVIGATE_SUCCESS is fired. Or just handle this special case directly in fluxible-router ?

mridgway · 2015-12-18T00:04:10Z

I think #324 could be relevant here as a way of batching these changes together.

itssumitrai · 2017-03-14T02:02:34Z

I am facing the same issue of connectToStores called multiple times for no reason. It seems to batch multiple events, when I need them to be dispatched instantaneously. For eg: a loading state.
And then the callback for connectToStore gets called multiple times even after that batching. I think there is some bug in connectToStores.

mridgway changed the title ~~ConnectToStore called multiple time~~ [addons-react] ConnectToStore called multiple time Mar 17, 2016

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[addons-react] ConnectToStore called multiple time #287

[addons-react] ConnectToStore called multiple time #287

Wykks commented Oct 20, 2015

mridgway commented Oct 20, 2015

Wykks commented Oct 23, 2015

mridgway commented Oct 28, 2015

Wykks commented Oct 29, 2015

mridgway commented Oct 29, 2015

Wykks commented Oct 30, 2015

mridgway commented Oct 30, 2015

Wykks commented Nov 1, 2015

pablolmiranda commented Nov 1, 2015

Wykks commented Nov 1, 2015

mridgway commented Nov 2, 2015

Wykks commented Nov 2, 2015

mridgway commented Dec 18, 2015

itssumitrai commented Mar 14, 2017

[addons-react] ConnectToStore called multiple time #287

[addons-react] ConnectToStore called multiple time #287

Comments

Wykks commented Oct 20, 2015

mridgway commented Oct 20, 2015

Wykks commented Oct 23, 2015

mridgway commented Oct 28, 2015

Wykks commented Oct 29, 2015

mridgway commented Oct 29, 2015

Wykks commented Oct 30, 2015

mridgway commented Oct 30, 2015

Wykks commented Nov 1, 2015

pablolmiranda commented Nov 1, 2015

Wykks commented Nov 1, 2015

mridgway commented Nov 2, 2015

Wykks commented Nov 2, 2015

mridgway commented Dec 18, 2015

itssumitrai commented Mar 14, 2017