Как заставить редуктор работать?

#reactjs #react-redux

#reactjs #react-redux

Вопрос:

Я только начал изучать reactjs amp; redux и пытаюсь реализовать добавление элементов в список. Это мой корневой компонент:

 //create store based on reducer
const store = createStore(listItem)
const rootEl = document.getElementById('root')

//render root component
const render = () => ReactDOM.render(
  <List
        addToList={() => store.dispatch({ type: 'ADD_TO_LISTS' },'testing')}
  />,
  rootEl
)

//call
render()

//subscribe the store
store.subscribe(render)
  

В компоненте списка метод визуализации выглядит следующим образом:

  render() {
    const { addToList } = this.props
    return (
      <p>
        <input type="text"  />
        <button onClick={addToList}>add</button>
       </p>
    )
  }
  

Редуктор выглядит так:

 const listItem = (state, action)  => {
  switch (action.type) {
    case 'ADD_TO_LIST':
      return [...state,action.text]

    default:
      return state
  }
}
  

Однако, когда я запускаю приложение, оно выдает ошибку:

 Uncaught error: expected reducer to be a function
  

В чем проблема с моим кодом?

Ответ №1:

Я понял это, забыл поставить ‘export default ListItem’ в конце редуктора