props가 React 구성 요소 내에서 정의되지 않았습니다.

Question

주 구성 요소의 소품을 모든 하위 요소에 복제하려고합니다. cloneElement를 사용하고 있지만 "소품이 정의되지 않았습니다"라는 오류가 발생합니다.

"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" 
    } 

Answer 1

당신에게 단지를 : 여기에

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; 

내 종속 버전입니다 :

그것은 것의 다른 사람이 같은 문제가 발생하는 (https://github.com/wesbos/Learn-Redux-Starter-Files/issues/6)

이 내 주요 구성 요소에 대한 코드입니다 이 소품을 복제품으로 주어야한다.

cloneElement는 주 노드에 노드 하나를 제공하는 경우에만 작동한다는 점을 고려하십시오. 많은 사람들이 다음과 같은 루프를 수행하는 경우 documentation