問題タブ [react-state-management]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
reactjs - AntDesign と PrimeReact を使用した React の回避可能な再レンダリングの問題
Reactで巨大なアプリケーションを開発しています。私たちのフォームの 1 つには、さまざまなタブ項目に配置された 60 以上のコンポーネントが含まれています。
入力を編集しようとすると、テキスト ボックスに入力された文字が表示されるまでに 190 ミリ秒かかりました。何時間も問題を掘り下げた後、コンポーネントを追加すると応答時間が長くなることに気付きました。次に、問題は antdesign のレンダリング ロジックにあると判断しました。次に、「why-did-you-update」パッケージを使用して PrimeReact で試しました。結果は同じでした！
状態に変更が発生すると、すべてのコンポーネント (アイコン :) を含む) が「更新した理由」メッセージごとにレンダリングを試みました。
ここにサンドボックスがあります: https://codesandbox.io/s/6w30ro2l9w
「更新した理由」メッセージは間違っていますか、それとも何か不足していますか?
javascript - モーダル ダイアログ ボックスからデータを変更した後、React コンポーネントを更新する
React を学習するための小さな Web アプリケーションを構築していて、現在問題にさらされています。私の仕事は、特定の都市名をクリックして、その都市名が表示される別のコンポーネントに移動することです。
その 2 番目のコンポーネントには、都市の名前を変更できるモーダル ダイアログ ボックスが 1 つあります。これを行っている間、コンポーネントには、モーダル ダイアログ ボックスから選択した新しい都市名ではなく、古い都市名が表示されたままです。ページを手動で更新すると、その新しい名前が表示されます。私は反応するのが非常に新しく、そのようなことに混乱しています。更新された都市名をレンダリングするにはどうすればよいですか?
SecondTable コンポーネント:(都市の名前を表示したい場所)
新しい都市を選択したモーダル ダイアログ ボックスのコンポーネント:
都市の初期リストの My Home コンポーネント:
コンポーネントのルート: