問題タブ [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.
jquery - ReactJSとReact Routerを使用して各ルートでページの背景色を変更しますか?
ReactJS と React Router を使用して、新しいルートに移動するときにブラウザの背景色を変更するにはどうすればよいですか? 途中で見つけたアイデアについては、以下の編集を参照してください。
各ページビューでこれを機能させることができますが<div>
、ブラウザウィンドウ全体に背景が表示されるように、完全な背景で機能させる必要があります。
私はjQueryで遊んでいますが、それがこれを解決する正しい方法であるかどうか疑問に思っていますか? 私も を使用しようとしていますReact.DOM.body
が、機能していません:
EDIT 1:
これでうまくいきましたが...つまり、背景を変えたいページごとにこのCSSクラスを複製する必要があります。使用するには、各リターンを次のようにラップします: <div className="my-signup-bkg">
:
EDIT 2: これは別の方法です。私はこれが好きです.CSSの行数が少なくて済み、ReactJSコンポーネントでより明示的です. この CSS を DIV に設定します。
これを ReactJS コンポーネントで使用します。
javascript - CodeKit Hook で Bash スクリプトが機能しない
ターミナルからreact-toolsを使用して、次のスクリプトを実行して JSX を JavaScript にコンパイルできます。
ただし、同じコード行を CodeKit フックに入れようとしても、何も起こりません。に置き換えるとmkdir ./dummy
期待どおりに機能し、作業ディレクトリが正しいことを確認します。JSX ( /usr/local/bin/jsx
) またはアセットへの絶対パスを指定しても、違いはないようです。明らかにmkdir
機能しているので、フックが適切にトリガーされていることがわかります。
それが機能するかどうかを確認するために、ダミーの JavaScript ファイルも縮小してみましたが、効果はありませんでした。
私は絶対に困惑しています。JSX と CodeKit の統合に成功した人はいますか?
facebook - React-tools JSX コンパイル ネストされたフォルダー エラー
Facebook が提供する Node モジュール react-tools を使用して、JSX ファイルを適切な .js ファイルにコンパイルしようとしています。
ただし、サポートされているコマンドを使用しても、フォルダー内のサブフォルダー内にネストされたファイルをビルドできませんsrc
。
これをjs/src/module1/main.jsx
今ビルドすると、react-tools が正常にビルドされます
しかし、その後エラーを吐き出します:
ただし、最初にディレクトリを作成すると、js/build/module1
問題は発生しません。反応は、出力ディレクトリに既にサブディレクトリがあることを期待しているようです。ここで何か間違ったことをしていますか、それとも現時点での反応ツールのバグですか?
reactjs - サーバーとクライアントで同じ JSX コードから生成された異なるマークアップ
これは私のJSXです:
これは、サーバー上で ( を使用してReact.renderComponentToString()
) 生成され、クライアントに送信されるものです。
そして、これはクライアント側(ブラウザ内)で生成されるものです:
どうやら 2 つのスパンが欠落しており、それが原因React attempted to use reuse markup in a container but the checksum was invalid
です。エラー。
問題はJSXコンパイラにあると思います。バンドルされてクライアントに送信される生成された JavaScript は、サーバーが使用しているものとは異なります。
面白いことに、JSX のインデントを「修正」すると、うまくいきます。サーバーとクライアントの両方が、これらの余分なスパンなしで同じ HTML マークアップを生成します。
ただし、JSX インデント幅に注意することについてのドキュメントを読んだことがなく、この種の問題をデバッグするのが難しい (または少なくとも煩わしい) ため、少し緊張します。
javascript - React Router: props を activeRouteHandler に渡すことができません
処理されたコンポーネントにいくつかの小道具を渡そうとしていますが、react-router はそうしません。
URLに「#/」が表示されるようになったため、ルーターは正常にロードされます。左のナビゲーションは正常にレンダリングされ、状態も更新されます。ただし、処理されたコンポーネント、つまり objectHandler には props.selected はありません。ここで何か不足していますか?ありがとう。
反応ルーター 0.7.0 を使用しています