React路由器历史是字符串?

时间:2017-03-14 09:01:35

标签: javascript reactjs react-router

我尝试使用哈希历史记录在浏览器中开始使用react路由器,我从版本3的指南中复制了此代码。

import React from "react";
import ReactDOM from "react-dom";
import {  Router,  Route,  Link, hashHistory } from 'react-router';

const App = React.createClass({
  render() {
    return (
      <div>
        <h1>App</h1>
        <ul>
          <li><Link to="/about">About</Link></li>
          <li><Link to="/inbox">Inbox</Link></li>
        </ul>
        {this.props.children}
      </div>
    )
  }
})

const About = React.createClass({
  render() {
    return <h3>About</h3>
  }
})

const Inbox = React.createClass({
  render() {
    return (
      <div>
        <h2>Inbox</h2>
        {this.props.children || "Welcome to your Inbox"}
      </div>
    )
  }
})

const Message = React.createClass({
  render() {
    return <h3>Message {this.props.params.id}</h3>
  }
})

var history = hashHistory;

console.log(history);

ReactDOM.render((
  <Router history="{history}">
    <Route path="/" component={App}>
      <Route path="about" component={About} />
      <Route path="inbox" component={Inbox}>
        <Route path="messages/:id" component={Message} />
      </Route>
    </Route>
  </Router>
),
document.getElementById('app-root'));

当我打开文档时,我收到了这些错误

  

警告:道具类型失败:history类型的道具string无效   提供给Router,预计object

我之前记录了history,它看起来像一个对象

enter image description here

  

未捕获错误:您提供了使用history v4.x或v2.x及更早版本创建的历史记录对象。这个版本的React Router只是   与v3历史对象兼容。请更改为历史v3.x。

我已安装react-router@3以及history@3,我可以确认

+ - react-router@3.0.2 extraneous

我无法在列表中找到history,但如果我转到目录,我可以看到package.json

"version": "3.3.0"

1 个答案:

答案 0 :(得分:2)

删除&#34;&#34;从历史中签名

<Router history={history}>