1
私は非常に反応しています（まだ学習しています）。私が気付いたことの1つは、componentは常にHTML（jsx）をコンテンツとして返すということです。関数のみを含むリアクションレンダーコンポーネント
しかし、componentには機能しか含まれていないのでしょうか？たとえば、私のfooterには静的コンテンツしかありません。プレーンテキストとbuttonはホームページに移動します。だから、これは私がやろうとしているものです：
index.htmlを
<body>
<main id="app"></main>
<footer id="footer">
<!-- Some other content -->
<button onClick={this.onButton}>Home</button>
</footer>
<script src="/app/bundle.js"></script>
</body>
Footer.js
class Footer extends React.Component {
onButton() {
console.log('Button clicked');
}
render() {
console.log('render');
return null;
}
}
render(<Footer/>, window.document.getElementById("footer"));
この方法で、componentが実行されますと、私は見ることができますただし、ログはindex.htmlに定義されているbuttonが削除されます。一方
私はcomponentからrender()を削除した場合、私はこのエラーを取得する：私は前に言及し、またの項目2に基づいてするのを忘れて
Footer(...): No
rendermethod found on the returned component instance: you may have forgotten to definerender.
一つのこと@答えを返す、リンクを作成するためにplaing htmlを使うことについては、私が現在使っているReactルーターを使わないと、ページ全体をリロードすることになります。
ので、例えば、私はこのようなプレーンなHTMLでfotter上のリンクを作成する場合：
<a href="/contact">Contact</a>
ページをリフレッシュするために起こっているので、それ以外のリンクはすべてをリセットしようとしている上でクリックします。
これは、コンポーネント内で宣言されたHTML全体を使用する代わりに、コンポーネントから関数を使用するほうがよい理由です。
さて、はい、私は同意します。私が与えた例はあまりにも単純すぎるかもしれない。それでも同じコンテストでは、自分の電子メールを記入してニュースレターに登録するための入力とボタンがあると想像してください。残りはすべて平文です。あなたはまだそれをコンポーネントに変換しますか？あるいは、単に関数を使うためのコンポーネントを作成するのが「あまりにも多い」コンテキストでは、 – celsomtrindade
@CelsomTrindade私はこれが論評されると思います。私は自分のコードベースの他の場所でやっているように、一貫性を維持しようとします。私が個人的に選択しなければならない場合、私はまだ 'Footer'コンポーネントを作成します。これは、ビュー階層から' SubscribePane'がフッターの内側にあるためです。私は、これらのすべてをコンポーネント内に保持し、複雑さの要求がサブスクリプションの事柄を将来コンポーネントに分解する場合でも必要とします。 – aks
@CelsomTrindade私も真実の単一のソースを追加するのを忘れてしまったので、明日あなたはいくつかの変更をしたいと思って、新しい開発者がそれに取り組んでいます。 jsxまたはhtmlで？ – aks