Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk menghantar prop kepada komponen yang dikendalikan dalam penghala tindak balas?

Bagaimana untuk menghantar prop kepada komponen yang dikendalikan dalam penghala tindak balas?

Patricia Arquette
Patricia Arquetteasal
2024-10-24 00:02:02177semak imbas

How to Pass Props to Handled Components in React Router?

Melalukan Props kepada Komponen yang Dikendali dalam Penghala Reaksi

Dalam aplikasi React.js yang menggunakan Penghala Reaksi, adalah perkara biasa untuk menghadapi keperluan untuk menghantar prop kepada komponen yang dikendalikan. Untuk mencapai matlamat ini, terdapat beberapa pendekatan yang perlu dipertimbangkan:

Satu pendekatan mudah ialah membalut komponen yang dikendalikan dengan komponen baharu yang mengambil prop yang diingini dan menurunkannya mengikut keperluan:

<code class="javascript">var CommentsWrapper = React.createClass({
  render: function () {
    return <Comments myprop="value" />;
  }
});</code>

Dengan cara ini, anda boleh menggunakan CommentsWrapper sebagai pengendali untuk laluan yang diingini:

<code class="javascript">var routes = (
  <Route path="/" handler={Index}>
    <Route path="comments" handler={CommentsWrapper}/>
    <DefaultRoute handler={Dashboard}/>
  </Route>
);</code>

Walau bagaimanapun, pendekatan ini boleh menjadi sukar jika anda perlu menghantar prop kepada berbilang komponen yang dikendalikan. Dalam kes sedemikian, pendekatan yang lebih fleksibel ialah menggunakan sifat komponen dalam konfigurasi laluan, yang membolehkan anda menghantar prop terus kepada komponen yang dikendalikan:

<code class="javascript">var routes = (
  <Route path="/" component={Index}/>
);

var Index = React.createClass({
  render: function () {
    return (
      <div>
        <header>Some header</header>
        <RouteHandler myprop="value" />
      </div>
    );
  }
});</code>

Dengan pendekatan ini, anda boleh menghantar prop terus ke komponen Komen tanpa memerlukan pembungkus:

<code class="javascript"><Route path="comments" component={Comments}/></code>

Atas ialah kandungan terperinci Bagaimana untuk menghantar prop kepada komponen yang dikendalikan dalam penghala tindak balas?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn