React カスタム コンポーネントの条件付きレンダリングの課題を探る

React アプリケーションのカスタム コンポーネントでの条件付きレンダリングで問題が発生しています。私は、特定の条件が満たされた場合にのみコンテンツをレンダリングする条件付きレンダリング用のカスタム コンポーネントの作成に取り組んできました。これが私の現在のコードです: importReactfrom'react';functionConditionalRenderComponent({condition,children}){return({condition&&children});}

P粉301523298 2023-08-18 15:58:43 0  2  586

配列によってレンダリングされた以前の React コンポーネントの状態を更新するメソッド

React コンポーネントを配列に追加し、[コンポーネントの追加] ボタンをクリックしたときに配列をレンダリングしました。各コンポーネントは、プロパティとして count フックに渡すことによってレンダリングされます。問題は、コンポーネントが配列に追加されてレンダリングされると、ボタンを使用してカウントをインクリメントしても、カウントフックは更新されますが、配列からレンダリングされたコンポーネントは更新されないことです。 [コンポーネントの追加] ボタンをもう一度クリックすると、新しいコンポーネントが更新されたフックでレンダリングされます。ただし、以前のコンポーネントは追加されても更新されませ...

P粉014218124 2023-09-08 21:35:51 0  1  581

vue.js がコンポーネントを再帰的にレンダリングする方法。

最初に基本的なコンポーネントを書き、その後再帰レンダリング用のコンポーネントを導入しようと思ったのですが、導入後にテンプレートやレンダリング関数が定義されていないという問題が発生してしまうのですが、解決方法を教えていただけますか。

淡淡烟草味 2017-07-05 10:59:35 0  2  1349

React コンポーネントが 2 回レンダリングされるのはなぜですか?

React コンポーネントが 2 回レンダリングされる理由がわかりません。そこで、params から電話番号を抽出して状態に保存し、Firestore 経由で検索できるようにします。電話番号とゼロ点が 2 回レンダリングされることを除いて、すべてが正常に動作しているようです。 2 回目のレンダリングではすべてのデータが正しく表示されます。誰か解決策を教えてくれませんか? classUpdateextendsComponent{constructor(props){super(props);co

P粉268654873 2023-10-16 12:47:00 0  1  719

JavaScript - カスタム サブコンポーネントが親コンポーネント データを受け取る、v-for を使用して複数のサブコンポーネントをレンダリングする方法

コードから始めましょう。現在、子コンポーネントに 4 つのオブジェクトが渡されています。v-for を使用して 4 つの子コンポーネントをレンダリングするにはどうすればよいですか? v-for は親コンポーネントのテンプレートに配置する必要がありますか? それとも子コンポーネントに配置する必要がありますか?

PHP中文网 2017-05-19 10:44:00 0  1  641

javascript - vueでカスタムコンポーネントをレンダリングする方法

コードは次のとおりです: cbutton はカスタム コンポーネントです。ケース 1 の場合は正常で問題ありません。ケース 2 の場合、v-html はネイティブ コンポーネントのみをレンダリングできます。ケース 2 の場合、動的出力が必要です。この状況は発生しますか? render を使用して解決する必要がありますか? jsx はどうですか? render を使用したことがありません。関数、助けてください。

phpcn_u1582 2017-06-28 09:28:58 0  1  893

JavaScript - vue コンポーネントのレンダリングの問題が 2 回発生する

{コード...} は 2 回レンダリングされました。1 回目はエラーが報告されましたが、2 回目はデータが正常にレンダリングされました。何が問題ですか? 。 。

天蓬老师 2017-05-18 10:52:57 0  3  750

「エレメントレンダリング」はありますか？イベント？

Web アプリケーション内のテキストのサイズを正確に測定する必要があります。これを行うには、(関連する CSS クラスを使用して) 要素を作成し、その innerHTML を設定してから、appendChild を使用してそれをコンテナーに追加します。これを実行した後、要素がレンダリングされるまでしばらく待つ必要があります。要素の offsetWidth を読み取ってテキストの幅を知ることができます。現在、setTimeout(processText,100) を使用してレンダリングが完了するまで待機しています。リッスンできるコールバック、または作成時にそれを伝えるより信頼性の高い方法はありま...

P粉727531237 2024-02-26 10:42:45 0  2  551

angular.js - Angular 2 でコンポーネントを強制的に再レン​​ダリングするにはどうすればよいですか?

コンポーネントがゾーン外で更新されるため、その更新がレンダリングされないようです。この理由は単なる推測であり、私にもわかりません。 。 。

巴扎黑 2017-05-15 17:08:21 0  1  657

自分でリンクをクリックして、React Router コンポーネントを再レンダリングします。

私は React Router Dom v6 を使用しています。 1 つのリンクまたは別のリンクをクリックすると、Route コンポーネントは通常どおりレンダリングされます。ただし、「/pathOne」がアクティブな状態で再度クリックしても、何も起こりません。アクティブなリンクをクリックしてルート要素を強制的に再レン​​ダリングする方法はありますか?全てをリフレッシュできるんです。

P粉295728625 2023-07-27 22:31:16 0  1  502

Vue コンポーネント内で Vue を結合して HTML をレンダリングする

プロジェクトを Vue2 から Vue3 にアップグレードしようとしています。そこには、さまざまな Vue コンポーネントのコレクションを含むコンポーネントがあります。 Vue2 での動作方法は、Twig で Twig テンプレート (例: field.twig) を呼び出し、:is 属性と Vue.compile メソッド (<div:is"compile(element.twig) を使用してコンパイルのために Vue に送信します。コンテンツ） ..."）。これは、Twig テンプレートが Vue に送信するものです。 しかし、Vue3 では、これはもう機能しな...

P粉193307465 2024-03-26 14:35:53 0  1  487

複数のコンポーネントをレンダリングしようとすると、React Native レンダリング エラーが発生します

ユーザーが「追加」ボタンを押した後に構築された同じカスタム コンポーネントの複数のコピーをレンダリングしたいと考えています。私のコードは次のとおりです: import"react-native-get-random-values";import{StyleSheet,TextInput,View,Text,TouchableHighlight,Button}from'react-native';importReact,{useState}from'rea

P粉043566314 2023-09-05 18:57:09 0  1  510

set*** 関数が呼び出されますが、関数コンポーネントの再レンダリングは実行されません。

私のスクリプトは以下のようになります。API が項目を取得した後、コンポーネントを再レンダリングして、EnhancedTable を表示させたいと考えています。ただし、このスクリプトでは、apifetch は成功しますが、EnhancedTable は表示されません。 response.data は正しいデータを返しますが、再レンダリングは実行されません。どこで私は間違えましたか？ constMetaPanel=(props)=>{const[drawingItems,setDrawingItems]=React.useState([])

P粉864872812 2024-04-04 09:53:14 0  1  419

erb ビューでハイパースタック コンポーネントを使用してレンダリングする方法

たとえば、多くのロジックを含む erb ページがあります。 Hyperstackを使用してこのページにユーザーメッセージを作成したいと考えています。この erb ページでハイパースタック コンポーネントをレンダリングするにはどうすればよいですか?更新: Hyperstack コンポーネントが application.erb に埋め込まれているため、これが可能であることはわかっています。

P粉301523298 2023-08-16 15:03:45 0  1  484

javascript - React-Native での FlatList の遅延レンダリングは項目に基づいているのか、最小のコンポーネントに基づいているのか教えてください。

FlatList は子要素を遅延レンダリングし、画面に表示される直前にのみレンダリングを開始します。それでは、アイテム単位でレンダリングされるのでしょうか、それとも最小のコンポーネント単位でレンダリングされるのでしょうか?リストに 3 つの項目があり、1 つの項目が 3 つの画面を占有し、各項目に 10 個のコンポーネントが含まれ、最初の項目の最初の 3 つが最初の画面にあると仮定します。

滿天的星座 2017-05-31 10:37:53 0  1  767

コンテンツをスロットにレンダリングする方法

以下に示すように、子コンポーネントにスロットを持つボタンを作成しました。スロットの名前はslotDigitizePolygonBtnLabelです。子コンポーネントのボタンには、ボタンが無効かどうかを示す disableState というプロパティが必要です。親コンポーネントで、子コンポーネントのボタンをレンダリングし、disabilityState の値を親コンポーネントから子コンポーネントに渡したいと考えています。コードを実行しても何も表示されません。どこに間違いがあるのか​​、またその修正方法を教えてください。サブアセンブリ

P粉877114798 2023-08-18 00:30:15 0  1  580

Next.js は条件付きレンダリングとレンダリングされていない HTML のプリレンダリングをサポートしていますか?

Next.js は、特定のボタンがクリックされた場合にのみ表示されるページの HTML を事前にレンダリングしますか?たとえば、タブがある場合、まだ表示されていないタブのコンテンツがレンダリングされますか?

P粉450744515 2023-08-14 17:48:55 0  1  562