Question

这是我的书单容器

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


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

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

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

export default connect(mapStateToProps)(BookList);

这是我的app.js文件

  import React from 'react';
  import { Component } from 'react';
  import BookList from '../containers/book-list';

  export default class App extends Component{
    render(){
      return(
        <div>
        <div>React simple App</div>
        <BookList/>
        </div>
      );
    }
  }

这是我在Reducers文件夹中的index.js文件

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

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

export default rootReducer;

这是我的主要index.js文件，它在

上呈现app组件

import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/app';
import './index.css';

ReactDOM.render(
   <App />,
  document.getElementById('root')
);

这是我的书籍减速机

export default function () {
  return [
    {title: 'AAA1'},
    {title: 'BBB2'},
    {title: 'CCC3'},
    {title: 'DDD4'},
  ]
}

请告诉我错在哪里。

Answer 1

创建store并将您的组件封装在Provider之内

import {createStore} from 'redux';
import { Provider } from 'react-redux'
import RootReducer form '/path/to/rootreducer';
import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/app';
import './index.css';
const store = createStore(RootReducer);

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

＆＃34;找不到＆＃34;存储＆＃34;在上下文或道具＆＃34;我在尝试简单的react-redux代码时遇到此错误

1 个答案: