如何使用redux添加项目？

Question

这是文件app.js

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App'
import {createStore} from 'redux'
import {Provider} from 'react-redux'
import reducers from './reducers'

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

这是减速器

let defaultState = []
export default function reducer(state = defaultState, action){
   switch(action.type){
       case 'ADD_TODO':
           return {
               defaultState : [...state, action.text] 
           }
       default:
           return state
   }
}

这是文件item.js

.......
import addTodo from './action'
class Item extends Component {
    constructor(){
        super()
        this.inputRef = createRef()
    }
    render() { 
        return (
        <>
            <input ref = {this.inputRef} type = 'text'></input>
            <button onClick = {() => this.props.add(this.inputRef.current.value)} type= 'button' >Add Todo</button> 
            {this.props.todoList.map(item => <h5>{item}</h5>) } 
            {/* this is error */}
        </>
        );
    }
}

const mapStateToProps = (state) => {
    return {
      todoList : state
    }
}
const mapDispatchToProps = (dispatch) => {
   return {
    add : (text) => dispatch(addTodo(text))
   }
}
export default connect(mapStateToProps,mapDispatchToProps)(Item)

这是文件action.js

const ADD_TODO = 'ADD_TODO'
 const addToto = (text) => {
    return {
        type : ADD_TODO,
        text
    }
}
export default addToto;

错误：this.props.todoList.map不是函数我想添加新项目，当我在按钮addtodo中单击并显示在标签h5上时。并在我从标签输入获得价值时检查我，这是真的

Answer 1

修复