2017-11-02 7 views
0

React、React Router v4とReduxを初めて使用しました。ルートコンポーネントでconnect()関数を使用しているときに私のReduxストアにアクセスできないようです。React Routerを使用して新しいルートに移動した後、Reduxストアにアクセスするにはどうすればよいですか?

{match: {…}, location: {…}, history: {…}, staticContext: undefined, myJson: {…}, …} 

私は私のインデックスページに私の店にアクセスすることができますしかし:this.propsは、私は歴史の対象であると信じて、コンソールに以下を記録します。別のページ(例:/チャット)に移動すると、店舗にアクセスできなくなります。以下の私のコード見つけてください:

App.js

export default class App extends Component { 
    render() { 
    return (
     <Router> 
     <div className="App"> 

      <Navigation /> 
      <Switch> 
      <Route exact={true} path='/' component={Identity} /> 
      <Route path='/chat' component={Message} /> 
      <Route render={function() { 
       return <p>Not found</p> 
      }} /> 
      </Switch> 

     </div> 
     </Router> 
    ); 
    } 
} 

Message.js

class Message extends Component { 

    render() { 
    console.log(this.props); 
    return (
     <div> 
     <h1>Chat Screen</h1> 
     <Inbox /> 
     <hr /> 
     <h2>Message</h2> 
     </div> 
    ); 
    } 
} 

const mapStateToProps = (state) => { 
    return { 
    myJson: state.myJson 
    }; 
}; 

export default withRouter(connect(mapStateToProps, null)(Message)); 

Index.js

ReactDOM.render(
    <MuiThemeProvider> 
    <Provider store={store}> 
     <App /> 
    </ Provider> 
    </MuiThemeProvider>, 
    document.getElementById('root') 
); 
registerServiceWorker(); 

Store.JS

export default createStore(
    combineReducers({ 
    myJson 
    }), 
    {}, 
    applyMiddleware(promise(), thunk, createLogger()) 
); 

任意の助けいただければ幸いです!

+1

loggin '' 'myJson:{...}' 'でも。チェック – lavish

+0

ああ私の言葉!母は私に知らせるために@豊かに感謝します。以前はその形式のログは見ていませんでした。あなたはそれが正しいです。とてもありがとうございました:) – Raja

答えて

0

この問題を抱えている他の人にとっては、Reduxストアが実際にアクセス可能であることが@lavishによって指摘されていました。オブジェクトは、新しいルートにアクセスするときに違った表示をしていました。

関連する問題