React.js小道具assignmend質問

Question

やあみんな、私は小道具約質問、私はかなり理解しない何かを持っている：アプリケーションIに

：

iはアプリの名前の主成分とヘッダ・コンポーネントを持って言うことができますが

で一部のHTMLを持っているとヘッダ・コンポーネントに私のような何かを持っている：あなたの名前は{} this.props.nameある

、あなたの年齢は、{} this.props.age

です0

私が理解していないのは、どこに小道具が割り当てられ、どこで使われているかです。名前= {"Max"}は小道具を割り当てるか、this.props.nameは小道具を割り当て、次に名前= {"max"}はそれを使用するか 私はそれを正しく説明してもわからない割り当ての

Answer 1

ヘッダーコンポーネントがAppコンポーネントから継承している場合は、Appコンポーネントからそのコンポーネントを取得します。

Appコンポーネントでは、これらのpropsをthis.stateから定義し、それらの状態をプロパティとしてヘッダコンポーネントに割り当てることができます。例えば

：

class App extends Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     age: 45, 
     name: 'Robert' 
    } 
    } 
    render() { 
    return (
     <div> 
     <Header ageOfPerson={this.state.age} nameOfPerson={this.state.name} /> 
     </div> 
    ); 
    } 

    class Header extends Component { 
    constructor(props) { 
     super(props); 
    } 
    render() { 
     <div> 
     <p>{ this.props.ageOfPerson } is { this.props.nameOfPerson }s age.</p> 
     </div> 
    } 
    } 
}