React-Router 1.0.0 未捕获错误:不变违规:元素类型无效 [英] React-Router 1.0.0 Uncaught Error: Invariant Violation: Element type is invalid

问题描述

我在使用 react-router 时遇到以下错误:-

谁能告诉我我错在哪里?

未捕获的错误:不变违规:元素类型无效:预期为字符串(对于内置组件)或类/函数(对于复合组件)但得到:对象.

var React = require('react');var ReactDOM = require('react-dom');var Router = require('react-router');var Route = Router.Route;var App = React.createClass({渲染:函数(){返回 (<div><h1>欢迎您</h1>{this.props.children}

);}});var Login = React.createClass({渲染:函数(){返回 (<div className="large-3 medium-6 large-centric medium-centric columns"><h1>登录页面</h1>

) }});ReactDOM.render((<路由器><Route path="/" component={App}><路由路径=登录"组件={登录}/></路线></路由器>), document.getElementById('content'));

解决方案

以下几行解决了我的错误

var ReactDOM = require('react-dom');var ReactRouter = require('react-router');var Router = ReactRouter.Router;var Route = ReactRouter.Route;

I am getting following error while using react-router :-

Can anyone tell me where i am wrong?

Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

var React = require('react');
var ReactDOM  = require('react-dom');
var Router = require('react-router');
var Route = Router.Route;


var App = React.createClass({
  render: function(){
    return (
  <div>
  <h1>Welcome</h1>
    {this.props.children}
  </div>
);
}
});

var Login = React.createClass({
  render: function(){
    return (    
      <div className="large-3 medium-6 large-centered medium-centered columns"> 
        <h1>Login Page</h1>
      </div>

  ) }
});

ReactDOM.render((
  <Router>
    <Route path="/" component={App}>
      <Route path="login" component={Login}/>      
    </Route>
  </Router>
   ), document.getElementById('content'));

解决方案

Following lines resolved my error

var ReactDOM = require('react-dom');
var ReactRouter = require('react-router');
var Router = ReactRouter.Router;
var Route = ReactRouter.Route;

这篇关于React-Router 1.0.0 未捕获错误:不变违规:元素类型无效的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！