Reduxに反応しますか？ 「文脈」の問題はどうですか？

Question

私は通常、Stackに関連するコードを投稿しますが、これはコミュニティの一般的な考え方についてのより多くの質問です。

データ/状態を管理するためにReduxをReactと共に使用することを提唱する多くの人がいるようですが、読んだり学習している間に、私は正しく見えないものを見つけました。このページの下部に

Reduxの

：http://redux.js.org/docs/basics/UsageWithReact.html（ストアを渡す）、それが反応「コンテキスト」の「マジック」を使用することをお勧めします。

1つのオプションは、すべてのコンテナコンポーネントの小道具として渡すことです。ただし、コンテナをコンポーネントツリーの深いところでレンダリングするという理由だけで、プレゼンテーションコンポーネントでもストアを配線する必要があるため、面倒です。

お勧めオプションは、魔法のように、すべてのコンテナコンポーネントへのストアを利用できるようにと呼ばれる特別なリアクトReduxのコンポーネントを使用することです

...

は、コンテキストページ（https://facebook.github.io/react/docs/context.html）と反応で

反応し、それを上部に警告が表示されます。

コンテキストは高度で実験的な機能です。 APIは将来のリリースで変更される可能性があります。そして、一番下の

：明確なコードを書くときに、グローバル変数は最高の回避さ

と同じように、あなたは、ほとんどの場合、コンテキストを使用しないでください...

は渡すためにコンテキストを使用しないでください。あなたのモデルデータをコンポーネントを通して。ツリーを通して、あなたのデータをスレッディングすることは明示的に理解する方がはるかに簡単です...

そう...

Reduxのは、むしろ 'を介して、各コンポーネントにダウンに沿ってstoreを渡すよりも、リアクト「コンテキスト」機能を使用することをお勧めします小道具。 Reactはその反対を推奨しますが。

また、Dan Abramov（Reduxの作成者）がFacebook（Reactの創作者）のために働いているように思われます。

• 私はこのすべてを読んでいますか？
• この問題に関する一般的なコンセンサスは何ですか？

Answer 1

コンテキストは高度な機能であり、変更される可能性があります。 React ReduxやReact Routerのようないくつかの図書館は、実験的性質にもかかわらず、その利便性を犠牲にすることがあるため、その利便性が欠点を上回る場合もあります。

ここで重要な部分は、のライブラリです。文脈がその振る舞いを変える場合、私たちは図書館の作者としてを調整する必要があります。ただし、ライブラリがコンテキストAPIを直接使用するように求めていない限り、ユーザーは変更を心配する必要はありません。

React Reduxはコンテキストを内部的に使用しますが、この事実を公開APIに公開しません。したがって、React Reduxを介してコンテキストを使用すると、コードが更新された場合の負担はReux Reduxになります。

最終的にReact Reduxは、常にストアを小道具として渡すことをサポートしているので、コンテキストを完全に回避したい場合は、その選択肢があります。しかし、私はこれが現実的ではないと言います。

TLDR：実際に何をしているのかわからない限り、直接コンテキストを使用しないでください。コンテキストに依存しているライブラリを使用することは、比較的安全です。

Answer 2

私は他人についてはわかりませんが、必要な店舗の小道具だけが自分のコンポーネントに渡されるように、react-reduxの接続デコレータを使用してコンポーネントをラップすることをお勧めします。 私はを消費していないので、これは意味でのコンテキストの使用を正当化します（そして、私が担当しているすべてのコードは原則として消費しません）。

コンポーネントをテストするときに、ラップされていないコンポーネントをテストします。react-reduxはそのコンポーネントで必要な小道具を通過しただけなので、テストを書くときに必要な小道具を正確に知ることができます。

私の主張は、私のコードでは単語のコンテキストを見たことがない、私はそれを消費しないので、ある程度、それは私に影響しないことです！これはFacebookの「実験的な」警告については何も言わない。もし文脈が消えれば、私はReduxが更新されるまで他の人たちと同じように釘付けになるだろう。

Answer 3

それは本当に簡単に反応するコンテキストにReduxの追加することができNPMモジュールは

https://github.com/jamrizzi/redux-context-provider

がhttps://www.npmjs.com/package/redux-context-provider

import React, { Component } from 'react'; 
import ReduxContextProvider from 'redux-context-provider'; 
import createStore from './createStore'; 
import actions from './actions'; 
import Routes from './routes'; 

export default class App extends Component { 
    render() { 
    return (
     <ReduxContextProvider store={store} actions={actions}> 
     <Routes /> 
     </ReduxContextProvider> 
    ); 
    } 
}