2016-08-22 2 views
0

Я после react redux tutorial с файлом приложения и основным компонентом, показанным ниже, но я получаю ошибку «Invalid пропеллера component подаваемого IndexRoute. В IndexRoute» и Uncaught TypeError: Cannot read property 'props' of undefined.Реагировать маршрутизатор не принимает компонент в качестве опоры

//app file 


import React from 'react'; 

import { render } from 'react-dom'; 


// Import Components 
import Main from './components/Main'; 
import Single from './components/Single'; 
import PhotoGrid from './components/PhotoGrid'; 

// import react router deps 
import { Router, Route, IndexRoute, browserHistory } from 'react-router'; 

const router = (
    <Router history={browserHistory}> 
    <Route path="/" component={Main}> 
     <IndexRoute component={PhotoGrid}></IndexRoute> 
     <Route path="/view/:postId" component={Single}></Route> 
    </Route> 
    </Router> 
) 

render(router, document.getElementById('root')); 

Я читал, что это может быть что-то делать с cloneComponent и попытались заменить эту часть с {React.cloneElement(this.props.children, {...this.props})}, но безрезультатно.

//main 

import React from 'react'; 
import { Link } from 'react-router'; 

const Main = React.createClass({ 
    render() { 
    return (
     <div> 
     <h1> 
      <Link to="/">Reduxstagram</Link> 
     </h1> 
     {React.cloneElement(this.props.children, this.props)} 
     </div> 
    ) 
    } 
}); 

export default Main; 
+0

попробуйте использовать '{this.props.children}' вместо '{React.cloneElement (this.props.children, this.props)}' – Alejandro

ответ

0

С кодом, который вы указали, нет ничего плохого. Согласно сообщению об ошибке, что-то не так с вашим компонентом . Поскольку компонент не отображается правильно, react-router не является в качестве компонента React. Проверьте файл . Чтобы убедиться, просто скопируйте и вставьте код из источника.

Смежные вопросы