我的应用应该分别在单击“添加”按钮或“减法”按钮时增加年龄（初始化为 20）或减少年龄。

我不明白为什么我一直收到此错误。我检查了 Reducer.js 以确保相应地使用“age”属性初始化状态，因此我完全不知道是什么原因导致了此错误。我仔细检查了所有正确的依赖项，并确保所有语法正确。

我认为可能导致此问题的另一件事是，我没有在 Reducer.js 中对代码行 const newState = {state 使用扩展运算符。由于某种原因，vscode 不允许我使用扩展运算符。每次我这样做并运行我的应用程序时，屏幕上都不会出现任何内容。使用扩展运算符是否需要安装依赖项？

以下是我的代码：

// index.js

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

import reducer from './reducer';
import { Provider } from 'react-redux';
import { createStore } from 'redux';

const store = createStore(reducer);

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

// App.js

import React from 'react';
import './App.css';
import { connect } from 'react-redux';

class App extends React.Component {
  render() {
    return (
      <div className="App">
        <div>Age: <span>{this.props.age}</span></div>
        <button onClick={this.props.onAgeUp}>Add</button>
        <button onClick={this.props.onAgeDown}>Sub</button>
      </div>
    );
  }
}

const mapStateToProps = (state) => {
  return { age: state.age };
};

const mapDispatchToProps = (dispatch) => {
  return {
    onAgeUp: () => dispatch({ type: 'ADD' }),
    onAgeDown: () => dispatch({ type: 'SUBTRACT' })

  };
};

export default connect(mapStateToProps, mapDispatchToProps)(App);

// Reducer.js

import { ADD, SUBTRACT } from './actionTypes';

const initialState = {
  age: 20
};

const reducer = (state=initialState, action) => {
    const newState = {state};

    switch(action.type) {
        case ADD:
            newState.age+=1;
            break;
        case SUBTRACT:
            newState.age-=1;
            break;
        default:
            return state;
    }

};

export default reducer;