Javascript React router isActive方法不起作用

我使用

es6

，

twitter引导

和

react路由器1.0.0-rc3

。我想创建一个导航栏并添加到

li

elements类

active

我尝试使用对象的

isActive

方法

链接包装器组件

export class LinkWrapper extends React.Component{

  constructor(props, context) {
      super(props, context);
  }

  render() {
    console.log(this.props.to);
    console.log(this.props.query);
    let isActive = this.context.history.isActive(this.props.to, this.props.query);
    let className = isActive ? 'active' : '';
    return (<li className={className}>
                <CustomersIcon />
                <Link {...this.props}/>
            </li>);
  }
}

LinkWrapper.contextTypes = {
  history: RouterPropTypes.history
};

export class NavBar extends React.Component {

  constructor(props, context) {
      super(props, context);
  }

  componentDidUpdate() {
      console.log('NavBar - componentDidUpdate');
    }

  render() {
    return (
        <nav className="navbar navbar-default">
            <div className="collapse navbar-collapse" id="main-navbar-collapse">
              <ul className="nav navbar-nav">
                  <LinkWrapper href="customers" />
              </ul>
            </div>
      </nav>
    );     
  }
}

NavBar.contextTypes = {
  history: RouterPropTypes.history
}

因为

this.props.to

和

this.props.query

是

未定义的

我还尝试在es5中使用History Mixin创建LinkWrapper组件，但this.props.to和this.props.query仍然是“未定义的”

var Router = require('react-router');
var { Route, DefaultRoute, RouteHandler, Link, History } = Router;

const Tab = React.createClass({
  mixins: [ History ],
  render() {
    console.log(this.props.to);
    console.log(this.props.query);
    let isActive = this.history.isActive(this.props.to, this.props.query);
    let className = isActive ? 'active' : '';
    return (<li className={className}>
                <CustomersIcon />
                <Link {...this.props}/>
            </li>);
  }
});

var路由器=require（'react-Router'）；
var{Route，DefaultRoute，RouteHandler，Link，History}=路由器；
const Tab=React.createClass({
mixins:[历史]，
render（）{
console.log（this.props.to）；
log（this.props.query）；
让isActive=this.history.isActive（this.props.to，this.props.query）；
让className=isActive？'active'：''；
返回（

）；
}
});
使用活动类名

<Link ... activeClassName="active" />

然后将历史道具添加到路由器

<Router history={history}>
    <Route component={App} path="/">
        <Route component={indexView} path="/index" />
    </Route>
</Router>

编辑：在下面查看我的答案
<Link ... activeClassName="active" />

// create browser history for navigating
import createBrowserHistory from 'history/lib/createBrowserHistory';
let history = createBrowserHistory();

<Router history={history}>
    <Route component={App} path="/">
        <Route component={indexView} path="/index" />
    </Route>
</Router>

this.props.history.isActive('/someroute')