2016-04-24 23 views
0

我是React/Redux世界的新手,但从我的理解中,reducer被添加到应用程序的全局状态。当我引用它在我的mapStateToProps虽然我得到一个ReferenceError: books is not definedmapStateToProps找不到缩小器

books_reducer.js

export default function() { 
    return [ 
    { title: 'Book1' }, 
    { title: 'Book2' }, 
    { title: 'Book3'} 
    ] 
} 

reducers.js

import { combineReducers } from 'redux' 

import booksReducer from './books_reducer' 

const appReducer = combineReducers({ 
    books: booksReducer 
}) 

export default appReducer 

container.js

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

class App extends Component { 
    renderList() { 
    return(
     this.props.books.maps((book) => { 
     return(
      <li key={book.title} className='lsit-group-item'>{book.title}</li> 
     ) 
     }) 
    ) 
    } 

    render() { 
    return(
     <ul className='list-group col-sm-4'> 
     {this.renderList()} 
     </ul> 
    ) 
    } 
} 

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

export default connect(mapStateToProps)(App) 

app.js

import React from 'react' 
import ReactDOM from 'react-dom' 
import { Provider } from 'react-redux' 
import { createStore } from 'redux' 

import App from './containers/containers' 
import appReducer from './reducers/reducers' 

let store = createStore(appReducer) 

ReactDOM.render(
    <Provider store={store}> 
    <App /> 
    </Provider>, 
    document.getElementById('app') 
) 
+0

如果在执行渲染之前执行'console.log(store.getState())',会发生什么? –

回答

2

看起来你可能在你的mapStateToProps函数中有语法错误。

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

您可能是想要返回一个对象文字。

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

对不起,我已经创建了商店。不知道为什么我不包括这一点。更新的问题 –