問題タブ [react-jsx]

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.

0 投票する
9 に答える
8960 参照

reactjs - Facebook React のタイプスクリプト

最近Reactを調べていて、JSXとtypescriptを使いたいと思っていました。これに関するリソースやReactの型定義を見つけることができませんでした。

JSX で Typescript を使用できますか?また、型定義は利用できますか?

0 投票する
1 に答える
2061 参照

react-jsx - RactiveJS と JSX

RactiveJS は JSX と互換性がありますか?

マークアップの一部は互換性がないと推測しています。厳密な型付けと、JavaScript ソースでテンプレートをきれいに記述できる点が気に入っています。多分これは悪い設計と見なされますか?

0 投票する
5 に答える
38256 参照

javascript - React.js: JavaScript から jsx を分離する方法

jsx をコンポーネントのレンダリング関数から別のファイルに移動する方法はありますか? もしそうなら、レンダリング関数でjsxを参照するにはどうすればよいですか?

0 投票する
1 に答える
1714 参照

javascript - jsx --watch は、jsx 構文を大文字の "React" ではなく小文字の "react" に変換します

私はFacebook の React チュートリアル http://facebook.github.io/react/docs/getting-started.htmlを大まかにフォローしていますが、別の html ファイルに適用しています。

これは、react スターター キットに基づく私の html ファイルです。

「jsx --watch src/build/」を実行すると、react-toolsをインストールしました

このスニペットを変換しています:

このスニペットに:

ただし、チュートリアルには次のスニペットが示されています。

小文字の 'r' が原因で、Web ページは「react が定義されていません」というエラーをスローします。これは本当です。クロムのコンソールから、「react」ではなく「React」が定義されていることを確認できます。

チュートリアルで説明されているように、jsx で正しい出力を作成するにはどうすればよいですか?

0 投票する
1 に答える
3524 参照

javascript - 子ノードを JSX と組み合わせるにはどうすればよいですか?

li 要素から ul リストを作成したいのですが、li 要素はさまざまなソースから取得されるため、1 つのステートメントでは実行できません。JSX は一連の子要素を処理できないようです。これにより、構文エラーが発生します。

理想的には、次のようなことをしたい:

これを達成する別の方法はありますか?

0 投票する
1 に答える
1838 参照

javascript - PhpStorm - 中括弧の自動挿入をオフにする方法

現在、私は JavaScript プログラミング (React フレームワーク) に PhpStorm を使用しています。React には、HTML を JavaScript コードに挿入できる JSX と呼ばれる特別な構文糖衣が追加されています。しかし、特定のJSXを挿入するとphpstormが間違ってしまうため、Enterキーを押して次の行に移動すると、常に不要な{. この動作を抑制する方法はありますか?

0 投票する
2 に答える
1778 参照

reactjs - React JSX: プロップをキャッシュしますか?

propsReact/JSX で同じ値に複数回アクセスする場合、オブジェクトをローカル変数にキャッシュすることをお勧めしますか?

0 投票する
2 に答える
3822 参照

javascript - AにネストされたSPANでJSXが期待される出力を生成しない

React を使い始めたばかりで、React コンポーネントを使用して既存の HTML 出力を再作成しようとしています。

これがバグなのか、何か間違ったことをしているのかはわかりませんが、最終的な HTML 出力は期待したものではありません。

問題は、タブ アンカー テキストをスパンでラップするべきではなく、次の番号のみでラップする必要があることです。

このJSXから始めます:

次の JS にコンパイルされます。

これは、次の HTML としてレンダリングされます。

javascript はスパンをアンカーの子として明確に示しているので、おそらくバグだと思いますが、何か間違ったことをしていないことを確認したかったのです。

0 投票する
2 に答える
7266 参照

reactjs - React JSX: 条件付き配列の一意のキー プロップ

子のない React コンポーネントでは、JSX 条件内で配列を使用しているため、「unique key prop」エラーが発生します。

配列内の各子には、一意の「キー」小道具が必要です。

エラーをトリガーしているコードは次のようになります。

子コンポーネントをレンダリングするときにkey prop が必要な理由は理解していますが、「配列内の子」がこのような子要素の任意のセットである場合、React/JSX を満たすにはどうすればよいですか?

0 投票する
1 に答える
2252 参照

reactjs - React: jsx ウォッチは、react.js のコンパイル ディレクトリを変更します

React JSX ファイルを次のようにプリコンパイルしようとしています。

サブディレクトリに縮小されていないreact.jsファイル (0.9.0) がありdev/js/libます。コンパイルすると、React ソースは になりpublic/AutoFocusMixin.jsます。名前が変更されるとともに、ソースは親ディレクトリに「移動」されます。

これは、縮小されていないバージョンの Reactを使用した場合にのみ発生します。コンパイルされたファイルは縮小されません。デバッグには縮小されていないソースを使用しています。

バージョン 0.8.0 でも同様の問題がありましたが、 という名前ではなくAutoFocusMixin、結果のファイルに名前が付けられ$.js、親ディレクトリにもありました。

私の解決策は、縮小されていないソースを正しい場所に手動でコピーすることでした。

誰かがこれに対するより良い解決策を思いついたのですか、それとも私が間違っているのかを見ていますか?

--

これは、React ソース (以下) の問題のあるコードであると思います。それが何をするかはわかりますが、その目的は不明です。私が使用しているファイルは、アドオンなしの React コアであることを確認しました。