2016-06-06 4 views
0

Я пытаюсь клонировать опору основного компонента для всех его детей. Я использую cloneElement, но я получаю сообщение об ошибке «реквизит не определен».реквизит не определен внутри компонента React

Это, кажется, в другие, имеющие один и тот же вопрос (https://github.com/wesbos/Learn-Redux-Starter-Files/issues/6)

Это код для моего основного компонента:

import React from 'react'; 
import Nav from './Nav'; 


const Main = React.createClass({ 
    render() { 
    return (
     <div className="wrapper"> 
     <Nav /> 
     {React.cloneElement(this.props.children, { ...this.props, children: props.children.props.children })} 
    </div> 
    ) 
    } 
}); 

export default Main; 

Вот мои варианты зависимостей:

"devDependencies": { 
    "babel-core": "^6.7.6", 
    "babel-loader": "^6.2.4", 
    "babel-plugin-react-transform": "^2.0.2", 
    "babel-plugin-transform-object-rest-spread": "^6.8.0", 
    "babel-plugin-transform-react-display-name": "^6.8.0", 
    "babel-preset-es2015": "^6.6.0", 
    "babel-preset-react": "^6.5.0", 
    "css-loader": "^0.23.1", 
    "express": "^4.13.4", 
    "node-sass": "^3.4.2", 
    "react-transform-catch-errors": "^1.0.2", 
    "react-transform-hmr": "^1.0.4", 
    "redbox-react": "^1.2.6", 
    "sass-loader": "^3.2.0", 
    "style-loader": "^0.13.1", 
    "webpack": "^1.13.1", 
    "webpack-dev-middleware": "^1.6.1", 
    "webpack-hot-middleware": "^2.10.0" 
    }, 
    "dependencies": { 
    "bulma": "0.0.18", 
    "classnames": "^2.2.3", 
    "react": "^15.1.0", 
    "react-addons-css-transition-group": "^15.0.1", 
    "react-dom": "^15.1.0", 
    "react-redux": "^4.4.5", 
    "react-router": "^2.4.1", 
    "react-router-redux": "^4.0.4", 
    "redux": "^3.5.2", 
    "shuffle-array": "^1.0.0" 
    } 
+3

Похоже, вы пытаетесь установить свойство 'children' ваших основных компонентов' props.children' на собственное свойство childs children, которое, откровенно говоря, не имеет смысла , Также вы вызываете 'props' напрямую, а не' this.props', что, вероятно, почему оно не определено. – hansn

ответ

0

Вы просто должны дать ваш клонированный реквизит, подобный этому

{React.cloneElement(this.props.children, this.props)} 

Учтите, что cloneElement работает только в том случае, если вы отдаете ONE основным детям. Если многие делают цикл, как описано в documentation

+0

Теперь я получаю эти ошибки. http://pasteboard.co/1uw5TeLf.png – Dileet

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