add router to route component props

ryanflorence · ryanflorence · commit acfe0cc032b8 · 2015-12-20T00:08:56.000-08:00
(maybe we don’t want this?)
diff --git a/examples/master-detail/app.js b/examples/master-detail/app.js
@@ -1,14 +1,8 @@
 import React from 'react'
 import { render, findDOMNode } from 'react-dom'
-import { createHistory, useBasename } from 'history'
-import { Router, History, Route, IndexRoute, Link } from 'react-router'
+import { browserHistory, Router, Route, IndexRoute, Link } from 'react-router'
 import ContactStore from './ContactStore'
-
-require('./app.css')
-
-const history = useBasename(createHistory)({
-  basename: '/master-detail'
-})
+import './app.css'
 
 const App = React.createClass({
   getInitialState() {
@@ -68,7 +62,6 @@ const Index = React.createClass({
 })
 
 const Contact = React.createClass({
-  mixins: [ History ],
 
   getStateFromStore(props) {
     const { id } = props ? props.params : this.props.params
@@ -104,7 +97,7 @@ const Contact = React.createClass({
   destroy() {
     const { id } = this.props.params
     ContactStore.removeContact(id)
-    this.history.push('/')
+    this.props.router.push('/')
   },
 
   render() {
@@ -123,7 +116,6 @@ const Contact = React.createClass({
 })
 
 const NewContact = React.createClass({
-  mixins: [ History ],
 
   createContact(event) {
     event.preventDefault()
@@ -132,7 +124,7 @@ const NewContact = React.createClass({
       first: findDOMNode(this.refs.first).value,
       last: findDOMNode(this.refs.last).value
     }, (contact) => {
-      this.history.push(`/contact/${contact.id}`)
+      this.props.router.push(`/contact/${contact.id}`)
     })
   },
 
@@ -158,7 +150,7 @@ const NotFound = React.createClass({
 })
 
 render((
-  <Router history={history}>
+  <Router history={browserHistory}>
     <Route path="/" component={App}>
       <IndexRoute component={Index} />
       <Route path="contact/new" component={NewContact} />
diff --git a/examples/master-detail/index.html b/examples/master-detail/index.html
@@ -1,5 +1,6 @@
 <!doctype html public "embarassment">
 <title>Master Detail Example</title>
+<base href="/master-detail"/>
 <link href="/global.css" rel="stylesheet"/>
 <body>
 <h1 class="breadcrumbs"><a href="/">React Router Examples</a> / Master Detail</h1>
diff --git a/modules/RouterContext.js b/modules/RouterContext.js
@@ -39,10 +39,7 @@ const RouterContext = React.createClass({
   getChildContext() {
     let { router, history, location } = this.props
     if (!router) {
-      warning(
-        false,
-        '`<RouterContext>` expects a `router` rather than a `history`'
-      )
+      warning(false, '`<RouterContext>` expects a `router` rather than a `history`')
 
       router = {
         ...history,
@@ -63,7 +60,7 @@ const RouterContext = React.createClass({
   },
 
   render() {
-    const { history, location, routes, params, components } = this.props
+    const { router, history, location, routes, params, components } = this.props
     let element = null
 
     if (components) {
@@ -74,6 +71,7 @@ const RouterContext = React.createClass({
         const route = routes[index]
         const routeParams = getRouteParams(route, params)
         const props = {
+          router,
           history,
           location,
           params,
diff --git a/modules/RouterUtils.js b/modules/RouterUtils.js
@@ -18,7 +18,7 @@ export function createRoutingHistory(history, transitionManager) {
   if (__DEV__) {
     history = deprecateObjectProperties(
       history,
-      'routing history is deprecated; use the `router` object instead'
+      '`props.history` and `context.history` are deprecated; use `props.router` on route components and `context.router` on deeper components.'
     )
   }
 

Original file line number	Diff line number	Diff line change
`@@ -18,7 +18,7 @@ export function createRoutingHistory(history, transitionManager) {`
`18`	`18`	`if (__DEV__) {`
`19`	`19`	`history = deprecateObjectProperties(`
`20`	`20`	`history,`
`21`		- 'routing history is deprecated; use the `router` object instead'
	`21`	+ '`props.history` and `context.history` are deprecated; use `props.router` on route components and `context.router` on deeper components.'
`22`	`22`	`)`
`23`	`23`	`}`
`24`	`24`