Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Context differs problem #249

Open
sergeylaptev opened this issue Jun 13, 2015 · 0 comments
Open

Context differs problem #249

sergeylaptev opened this issue Jun 13, 2015 · 0 comments
Labels

Comments

@sergeylaptev
Copy link

Hello, first of all sorry for my bad english:) I've made code example, which can help you reproduce this error.

routes.jsx

import React from 'react';
import { Route, DefaultRoute } from 'react-router';
import AppHandler from './handlers/AppHandler';
import LandingHandler from './handlers/LandingHandler';

export default (
  <Route name="app" path="/" handler={AppHandler}>
    <DefaultRoute handler={LandingHandler} />
  </Route>
);

index.jsx

import React from 'react';
import {
  create as createRouter,
  HistoryLocation,
  HashLocation
} from 'react-router';
import routes from './routes';
import Flux from './Flux';
import FluxComponent from 'flummox/component';

const flux = new Flux();
const location = HashLocation;
const router = createRouter({ routes, location });

router.run((Handler, state) => {
  React.render(
    <FluxComponent flux={flux}>
      <Handler {...state} />
    </FluxComponent>,
    document.getElementById('root')
  );
});

AppHandler.jsx (Just a simple wrapper for now)

import React, { Component } from 'react';
import { RouteHandler } from 'react-router';

export default class AppHandler {
  render() {
    return <RouteHandler {...this.props} />;
  }
}

LandingHandler.jsx

import React, { Component } from 'react';
import connectToStores from 'flummox/connect';

class LandingHandler extends Component {
  render() {
    return <span>{`${this.props.userLogged}`}</span>;
  }
}

export default connectToStores(LandingHandler, {
  auth: (store) => ({
    userLogged: store.state.userLogged
  })
});

When I started app, and went on default app route, I've got a warning message:
Warning: owner-based and parent-based contexts differ (values: undefined vs [object Object]) for key (flux) while mounting ConnectedComponent (see: http://fb.me/react-context-by-parent)

This message has gone when I removed FluxComponent in index.jsx, and pass flux instance to Handler instantly.
index.jsx

router.run((Handler, state) => {
  React.render(
    <Handler flux={flux} {...state} />,
    document.getElementById('root')
  );
});

In both cases routing and Flummox lifecycle functionality work fine. Hopefully you can reproduce this bug. Thanks

@sergeylaptev sergeylaptev changed the title Context differs propblem Context differs problem Jun 13, 2015
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants