Skip to content

Context differs problem #249

Description

@sergeylaptev

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

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions