NEXTJS传给钩子道具并接收redux动作

// 1. 创建Redux store并与NEXT.js应用程序关联
import { createStore } from 'redux';
import { Provider } from 'react-redux';
import rootReducer from './reducers';

const store = createStore(rootReducer);

function MyApp({ Component, pageProps }) {
  return (
    <Provider store={store}>
      <Component {...pageProps} />
    </Provider>
  );
}

export default MyApp;

// 2. 在需要传递道具的组件中使用useSelector钩子
import { useSelector } from 'react-redux';

function MyComponent() {
  const counter = useSelector(state => state.counter);

  return <div>{counter}</div>;
}

// 3. 在需要触发Redux动作的组件中使用useDispatch钩子
import { useDispatch } from 'react-redux';
import { increment } from './actions';

function MyButton() {
  const dispatch = useDispatch();

  const handleClick = () => {
    dispatch(increment());
  };

  return <button onClick={handleClick}>Increment</button>;
}