如何在TypeScript中输入Redux state以创建没有项目的新状态

npm install redux react-redux

import { createStore, combineReducers } from 'redux';
import { Provider, useDispatch, useSelector } from 'react-redux';

// 初始状态
const initialState = {
  count: 0
};

// Redux动作类型
const INCREMENT = 'INCREMENT';
const DECREMENT = 'DECREMENT';

// Redux动作创建函数
const increment = () => ({ type: INCREMENT });
const decrement = () => ({ type: DECREMENT });

// Redux reducer函数
const counterReducer = (state = initialState, action: any) => {
  switch (action.type) {
    case INCREMENT:
      return { ...state, count: state.count + 1 };
    case DECREMENT:
      return { ...state, count: state.count - 1 };
    default:
      return state;
  }
};

// 根reducer函数
const rootReducer = combineReducers({
  counter: counterReducer
});

// 创建Redux store
const store = createStore(rootReducer);

import React from 'react';
import ReactDOM from 'react-dom';

import { Provider } from 'react-redux';
import store from './appState';

import App from './App';

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

import React from 'react';
import { useSelector } from 'react-redux';

const Counter = () => {
  const count = useSelector((state: any) => state.counter.count);

  return (
    <div>
      <p>Count: {count}</p>
    </div>
  );
};

export default Counter;