問題タブ [reactjs]
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.
javascript - ReactJS は HTML 文字列を JSX に変換します
Facebook の ReactJS の扱いに問題があります。ajax を実行して html データを表示したいときはいつでも、ReactJS はそれをテキストとして表示します。(下図参照)
データは、jquery Ajax の成功コールバック関数を通じて表示されます。
これをhtmlに変換する簡単な方法はありますか?ReactJS を使用してどのようにすればよいですか?
javascript - Facebook React.js の例のエラー?
Facebook の Reactjs ライブラリを試してみたところ、すばらしいことがわかりました。私は例/チュートリアルを実行し、それを機能させました。
今私は: http://facebook.github.io/react/docs/interactivity-and-dynamic-uis.html
そして、私はコードを試しています:
上記のコードを実行した後、何も得られません。私のGoogle Chromeコンソールで、私が得たエラーはUncaught SyntaxError: Unexpected token <
、で始まる行にありました<p onClick={this.handleClick}>
コードの何が問題なのか教えてくれる人がいるかどうか疑問に思っていましたか?
よろしくお願いします。
javascript - 特定のイベントリスナーを react.js 要素から削除する方法
いくつかのハンドラーでこの単純なレンダリング関数を使用しています。
React.createClass 関数内で、関数のようなものを使用してthis.removeTheListener
、特定の mouseMove 関数を削除するにはどうすればよいですか? mouseMove 関数のパフォーマンスに関係なく、リソースが重いことはわかっていますが、私がやっていることは完璧なイベントです。
特定のリスナーだけを削除して、一度削除したら別の時点で追加し直すことはできますか?
reactjs - API が小さいのに、React のファイルサイズがこれほど大きいのはなぜですか?
ここに数字があります
- 最小+gzip 26k
- gzip 90k
- オリジナル 450+k
また、React のドキュメントには多くの機能がありません。なぜそんなに大きいのですか?
軽量DOMの実装という感じです。しかし、私は確信したい。
javascript - backbone.router と React の状態
ルートに基づいてReactコンポーネントの状態を設定する標準的な方法は何ですか? 次の React/Backbone の例があります。
myApp
外部からの状態を設定できるようにする必要があると思いますが、どうすればよいですか? これに関する例は見つかりません。
それとも、ここで間違った方向に考えているのかもしれません.Reactと一緒にルートを整理するより良い方法はありますか?
javascript - Double Network Request の後に外部 JSX テンプレートが取得されるのはなぜですか?
私はreactjsを調査していますが、External JSX template( )に対するこのDouble Networkリクエストを見て驚いていますloginform.js
。
どこ
index.html
および loginform.js
この二重のリクエストを回避する方法はありますか?
詳細については、添付の画像を検討してください。
reactjs - React.jsで小道具の状態の変化を聞く方法は?
Backbone.View を React に移植しています。何かが欠けているかもしれませんが、コンポーネントの状態を兄弟の状態に依存させる慣用的な方法がわかりません。たとえば、次のようなコンポーネントがあるとします。
そして、すべての handleClick がそれを行うとしましょうsetState({selected: true})
。私の質問は、このコンポーネントの兄弟の状態が true に設定される前に false に設定されていることを確認するにはどうすればよいかということです。
私の理想的な解決策は、小道具の状態の変化をリッスンし、Timeline コンポーネントからサブコンポーネントを強制的にレンダリングすることですが、これが受け入れられたアプローチであるかどうかはわかりません。
また、このコンポーネントを実装する別の方法を探しています。コンポーネントを分解する推奨される方法は、可能な限りステートレスに保ち、他の場所で再利用できるようにすることだと理解しているからです。
javascript - react.js でのバックボーン モデル/コレクションの変更の処理
ここ数週間、Facebook フレームワークの React.js と Backbone を一緒に使用してきましたが、Backbone コレクションに変更があった場合に React コンポーネントを再レンダリングする最も適切な方法が何であるかはまだ完全にはわかりません。 propとして渡されました。
現在私がしていることは、コレクションにリスナーcomponenentWillMount
を設定しchange/add/remove
、トリガー時に状態を設定することです。
モデルが状態に複製される例を見てきました:
小道具のモデル/コレクションが状態を使用する代わりにレンダリングで直接使用され、コレクション/モデルが変更されたときに forceUpdate が呼び出され、コンポーネントが再レンダリングされるバリアントも見ました。
さまざまなアプローチにはどのような利点と欠点がありますか? Reactの方法でそれを行う方法はありますか?
javascript - Reactのイベントオブジェクトからカスタム属性にアクセスするには?
http://facebook.github.io/react/docs/jsx-gotchas.htmlで説明されているように、React はカスタム属性をレンダリングできます 。
カスタム属性を使用する場合は、接頭辞 data- を付ける必要があります。
<div data-custom-attribute="foo" />
イベントオブジェクトからアクセスする方法が見つからないことを除けば、それは素晴らしいニュースです。
要素とdata-
プロパティは html で適切にレンダリングされます。のような標準プロパティにstyle
は、問題なくアクセスできますevent.target.style
。event.target
私が試した代わりに:
これらのどれも機能しませんでした。
javascript - React js のテストを作成するときにブラウザー イベントをシミュレートするにはどうすればよいですか?
div 要素のクリックをシミュレートするにはどうすればよいですか? それともマウス移動?それとも文字入力?
mochaのようなサーバー側のnodejs環境でどうすればいいですか? そして、カルマのようなランナーを使用して、ブラウザ環境でそれを行うにはどうすればよいですか?