React.js - ReactDOM.renderまたはインラインで使用できますか？

Question

私はREACTで開発を開始し、インラインで使用する方法について少し質問しました。

たとえば、次のコードスニペットがあります。

ReactDOM.render(
 
     <RitualPromoCode url="/Home/ValidatePromoCode" code="Bongo" location="1" package="17" />, 
 
     document.getElementById('promo-code') 
 
    );

私のMVCページ内でそれを使用して、上記使用して迷惑なときに...しかし、私は、HTMLページ内に新たに「タグ」インラインを使用することができるようにしたいと思います...例えば

 <RitualPromoCode url="/Home/ValidatePromoCode" code="Bongo" location="1" package="17" />

どのように私はこれをやって行くのですか？

私はページのさまざまな部分で複数のコンポーネントを使用したいが、1つの巨大なコンポーネントをまとめて使用する必要はありません。同じページの別のコンポーネントのプロパティを更新/変更するには、どのようにコンポーネントを取得できますか？

ありがとうございました

Answer 1

レンダリングは1か所で呼び出すことができます。他のすべてを含む「メイン」コンポーネントを作成してください。

ReactDOM.render(
    <App />, 
    document.getElementById('promo-code') 
); 

class App extends Component { 
    render() { 
    return (
    <div> 
     <RitualPromoCode url="/Home/ValidatePromoCode" code="Bongo" location="1" package="17" /> 
     <SomeOtherComponent /> 
     <MoreComponent /> 
     <MyComponent /> 
    </div> 
    ); 
    } 
}