在 redux 存储中复制嵌套对象

为什么todos我的 redux 存储中有重复的嵌套对象？

组件/todoInput.js

import React, { Component } from 'react';
import PropTypes from 'prop-types';

import actions from '../../actions';

class TodoInput extends Component {
  constructor(props) {
    super(props);

    this.state = {
      inputText: ''
    };

    this.handleChange = this.handleChange.bind(this);
    this.handleClick = this.handleClick.bind(this);
  }

  handleChange(e) {
    this.setState({
      inputText: e.target.value
    });
  }

  handleClick(e) {
    e.preventDefault();

    this.props.dispatch(actions.addTodo(this.state.inputText));
  }

  render() {
    return (
      <div>
        <input
          type="text"
          placeholder="todo"
          value={this.state.inputText}
          onChange={this.handleChange}
          />
        <button onClick={this.handleClick}>Sumbit</button>
      </div>
    );
  }
}

TodoInput.propTypes = {
  dispatch: PropTypes.func,
};

export default TodoInput;

减速器/ todo.js

import { ADD_TODO } from '../constants/actionTypes';

function getId(state) {
  return state.todos.reduce((maxId, todo) => {
    return Math.max(todo.id, maxId);
  }, -1) + 1;
}

const initialState = {
  todos: [{
    id: 0,
    text: 'Initial Todo',
    completed: false
  }]
};

export default function todos(state = initialState, action) {

  switch (action.type) {

    case ADD_TODO:
      return {
        ...state,
        todos: [{
          text: action.text,
          completed: false,
          id: getId(state)
        }, ...state.todos]
      };

    default:
      return state;
  }
}