問題タブ [react-dnd]
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 - 子の状態を親に持ち上げて、小道具として送り返すにはどうすればよいですか?
私は react-dnd を使用しており、その内部関数のほとんどがcomponent
パラメーターとして使用されるため、その関数内のコンポーネントのサイズと内容を決定できます。Component
のようなことができるように、コンポーネント自体への参照を提供しますgetDOMNode(component).getWhatever()
。
ただし、関数canDrop
は残念ながらこのパラメーターを受け取りません。コンポーネントパラメータを使用してcanDrop
関数内の位置を決定しようとしています。コンポーネントパラメータを使用できないため、ドキュメントが推奨しています:
component: 指定すると、コンポーネントのインスタンスになります。これを使用して、位置またはサイズの測定のために基礎となる DOM ノードにアクセスしたり、setState やその他のコンポーネント メソッドを呼び出したりします。インスタンスが呼び出されるまでに使用できない可能性があるため、意図的に canDrop から欠落しています。このメソッドをコンポーネントの状態に依存させたい場合は、props だけを使用できるように、状態を親コンポーネントに持ち上げることを検討してください。一般に、可能な限り props に依存すると、コードはよりクリーンになります。
コンポーネント自体を親に持ち上げて、それを小道具としてそれ自体に戻す方法がわかりません。このようなことが起こっている例を教えてください。
reactjs - react/lib/update - 複数のスプライス、複数のインデックス
で作業し、 react ('react/lib/update')react-dnd
のユーティリティを使用している間、以下のような構造で:update
state = {
data : {
items : []
/* array of 'fields' (flat objects items), and 'groups' (object that may have nested 'fields' under 'group.nested') */
}
}
配列からグループ (オブジェクト内の配列)update
に移動しようとすると、ユーティリティに問題があることに気付きました。field
items
nested
group
フィールドを(でsplice
)削除してから、ネストされた配列に追加しようとしました。このupdate
関数の結果は、フィールドが内部にネストされたグループを返しましたが、そのフィールドは宣言された元の位置から削除されていません$splice
。
以下に、問題の詳細な例を含むRunKitを見つけることができます
https://runkit.com/592da/splice-react-update-issue
アドバイス、またはより良い実践的な解決策を喜んで受け取ります。
ありがとう !
reactjs - 毎秒ブロックコンポーネントの再レンダリングに shouldComponentUpdate を使用する
そのゲームはreactとreduxで開発されました。私はreact-redux開発者ではありません(私は.net開発者です)が、私はそのプロジェクトを継続しなければならないので、私はreactとreduxに慣れていません.そのゲームのパフォーマンスは、一部のAndroid携帯ではあまりにも悪いです.だから私は分析しますproject.コンポーネントのrenderメソッドが毎秒機能していることがわかります.私のコンポーネントには30を超える他のコンポーネントが含まれています.したがって、毎秒再レンダリングされ、一部の古いAndroid携帯でパフォーマンスが低下します
React コンポーネントが毎秒再レンダリングされるのはなぜですか?これをブロックできますか? その問題を検索すると、解決策が shouldComponentUpdate 関数であることがわかります
しかし、この関数 nextstate では、この状態は同じです。nextProps.gameStore.get('state') と this.props.gameStore.get('state') は同じです。なぜ次の状態と現在の状態が同じなのですか?どうすればよいですか? do?私はコンストラクターを使用しますが、それでも同じですここではすべてのコンポーネントコードです
編集: Aftab Khan ディレクティブを使用して、コンポーネントを PureComponent に変更しましたが、ページが開かず、コンソールにエラーはありません
これを次のように変更します
それでもうまくいかないので、これに変更します
それでもブラウザで開かない