2017-06-19 3 views
0

component/file/classを作成してレビュックスストアに接続する必要があります。
このコンポーネントをレンダリングする必要はありません。
これは、ストアから値を返すメソッドを含むことができるヘルパーコンポーネントです。
私は、ファイルを作成しようとしました:
コンポーネント(ファイル)をレビュックスストアに接続する方法

export function getKeyFromReduxStore(key:string) {... 

が、これは、エクスポート機能と、私はできません(または知らない)Reduxのストアに接続するためにどのように単にファイルです。

<RouterWithRedux> 
      <Scene key="root">... 

を私が言ったように、これは何のシーンは、それは私が全体のアプリを通じて再利用したいだけのヘルパーコンポーネントのではありません:
すべての私のコンポーネントは、店のthroughtに接続されています。
どうすればそのようなコンポーネントを作成し、それをreduxに接続できますか?

答えて

1

Reduxストアには、ストアの状態を取得するgetStateというメソッドがあります。レキシックスストアが必要なファイルに作成したストアをインポートすることができます。

// in the file where you created your store 
 
import { createStore } from 'redux'; 
 

 
export const myStore = createStore(
 
    // ... some middleware or reducer etc 
 
) 
 

 
// in your component/file/class 
 
import { myStore } from '../path/to/store' 
 

 
export function getKeyFromReduxStore(key:string) { 
 
    return (myStore.getState())[key]; 
 
}

また、あなたはgetKeyFromReduxStore関数に店舗を渡すとストアが利用できるようになる成分が反応して、それを呼び出すことができます。

// component/file/class 
 
export function getKeyFromReduxStore(store, key) { 
 
    return store[key]; 
 
} 
 

 

 
// react component with access to store 
 
import { getKeyFromReduxStore } from '../path/to/file'; 
 

 
class MyKlass extends Component { 
 
    // ... your logic 
 
    render() { 
 
    const val = this.props.getKey(someVal); 
 
    } 
 
} 
 

 
const mapStateToProps = (state) => ({ 
 
    getKey: (key) => getKeyFromReduxStore(store, key), 
 
}) 
 

 
export default connect(mapStateToProps)(MyKlass);

mapStateToProps機能で例えば
関連する問題