2016-10-17 6 views
2

私はリミッターの状態を自分の反応コンポーネントのコンポーネントに接続しようとしています。そして`provider`に供給された` function`型の `store`、`オブジェクト `が期待される無効な子コンテキスト

export default function(){ 
    return [ 
     {title:'A'}, 
     {title:'E'} 
    ]; 
} 

は、iがindex.jsで結合減速にこれを追加しました:最後に

import {combineReducers} from 'redux'; 
import BookReducer from './reducer_books'; 


const rootReducer= combineReducers({ 
    books:BookReducer 
}); 

export default rootReducer; 

iは、親コンポーネントでそれを追加しようとここ はreducer_books.jsに減速のコードがあります:

import State from './reducer/index'; 
import { Provider } from 'react-redux'; 

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

と私が持っているターゲットコンポーネントで:

import React,{Component} from 'react'; 
import {connect} from 'react-redux'; 

class BookList extends Component{ 
    renderList(){ 
     return this.props.books.map((book)=>{ 
      <li key={book.title}>{book.title}</li> 
     }); 
    } 

    render(){ 

    return(
     <div> 
     <ul> 
      {this.renderList()} 
     </ul> 
     </div>); 
    } 
} 

function mapStateToProps(state){ 
    return{ 
    books:state.books 
    }; 
} 

export default connect(mapStateToProps)(BookList); 

残念ながら、それはと文句を言う:あなたの例では

Warning: Failed prop type: Invalid prop `store` of type `function` supplied to `Provider`, expected `object`. 
    in Provider (at index.js:11) 
Warning: Failed childContext type: Invalid child context `store` of type `function` supplied to `Provider`, expected `object`. 
    in Provider (at index.js:11) 
Warning: Failed context type: Invalid context `store` of type `function` supplied to `Connect(BookList)`, expected `object`. 
    in Connect(BookList) (at App.js:35) 
    in div (at App.js:33) 
    in div (at App.js:32) 
    in App (at index.js:12) 
    in Provider (at index.js:11) 
Uncaught TypeError: _this.store.getState is not a function 
Error: Attempted to update component `Connect(BookList)` that has already been unmounted (or failed to mount) 

答えて

2

あなたconfigure Storeが、私はあなたがこのステップを逃したと仮定した場合、私は表示されません

import reducers from './reducer/index'; 
import { Provider } from 'react-redux'; 
import { createStore } from 'redux'; 

const Store = createStore(reducers); 

ReactDOM.render(
    <Provider store={ Store }> 
    <App /> 
    </Provider>, document.getElementById('root') 
); 
関連する問題