this.props.items.map не является функцией использования реакции с редуксом для получения API

Question

Я пытаюсь создать приложение реагирования с использованием приставки, но при этом обнаружена ошибка. Ошибка: this.props.items.map не используется при использовании реакции с Redux при получении API, как показано в коде.

 render() {
    return (
      <Router>
        <div className="App">
          <div className="container">
            <Header />
            <Route exact path="/" render={props => (
              <React.Fragment>
                <Todos 
                />
              </React.Fragment>
            )} />
            <Route path="/about" component={About} />
          </div>
        </div>
      </Router>

---

import axios from "axios";

export const getItems = () => {
  axios.get('https://jsonplaceholder.typicode.com/todos?_limit=10')
    .then(res => dispatch({
      type: 'GET_ITEMS',
      payload: res.data
    }))
}

---

const initialState = { items: {} };

export default function (state = initialState, action) {
  switch (action.type) {
    case 'GET_ITEMS': return {
      ...state,
      items: action.payload
    };   
    default: return state
  }
}

---

class Todos extends Component {
  render() {
    return (
      (this.props.items.map)((todo) => (
        <React.Fragment>
          {todo.title}
        </React.Fragment>
      ))

   )
  }
}

const mapStateToProps = state => ({
  items: state.items
})

export default connect(mapStateToProps)(Todos);

Я пытаюсь отобразить извлеченные данные API в моем компоненте Todo, выше код. Я получаю вышеупомянутую ошибку.

Answer 1

Начальное состояние для items является объектом, но, вероятно, должно быть массивом. Только массивы имеют функцию map().

const initialState = { items: [] };