reactjs内の子コンポーネントにデータを渡す

Question

私はreactjsアプリケーションで作業しています。子コンポーネントにデータを渡したいと思います。私はParentを親コンポーネントとして、Test1とTest2を子コンポーネントとして持っています。また、私は親コンポーネントで一定のデータを持っています。すべての子コンポーネントに同じデータを渡したいと思います。どのように私はテストのデータにアクセスする方法

import React from 'react'; 
export default class Test1 extends React.Component { 
render() { 
return (
     <div className="summary-info"> 
      <div>From Test1</div> 
     </div> 
    ); 
} 
} 

Test1を

で親

import React, {PropTypes} from 'react'; 
import {bindActionCreators} from 'redux'; 
import {connect} from 'react-redux'; 
import {load} from 'redux/modules/viewlodging'; 
import Test1 from './Test1'; 
import Test2 from './Test2'; 
@connect(
state => ({data: state.viewlodging.data}), 
dispatch => bindActionCreators({load}, dispatch)) 
export default class Viewlisting extends React.Component { 
static propTypes = { 
data: PropTypes.object, 
load: PropTypes.func.isRequired 
} 
render() { 
const {data} = this.props; 
return (
<div> 
    <div className="row font14 relative"> 
     <div className="container relative"> 
      <div className="col-md-8"> 
       <div className="row details"> 
        <{data.title}> 
       </div> 
      </div> 
      <div className="col-md-4" > 
       <Test1/> 
       <Test2/> 
      </div> 
     </div> 
    </div> 
</div> 
); 
} 
} 

のTest1をコンポーネント コードでこのデータにアクセスすることができますか？

Answer 1

小道具として渡してからthis.propsでアクセスしてください。

あなたは親、あなたが渡したい小道具を追加で：

<Test1 data={data}/> 

をそれへのあなたの子供のアクセスにthis.propsで：エラーデータを取得

<div className="summary-info"> 
     <div>From Test1 - this is from parent {this.props.data}</div> 
    </div> 

Fiddle