使用React - Redux时将转换登录放在何处

// actions.js
export const login = () => {
  return {
    type: 'LOGIN',
  };
};

// reducer.js
const initialState = {
  isLoggedIn: false,
};

const reducer = (state = initialState, action) => {
  switch (action.type) {
    case 'LOGIN':
      return {
        ...state,
        isLoggedIn: true,
      };
    default:
      return state;
  }
};

export default reducer;

// LoginButton.js
import React from 'react';
import { connect } from 'react-redux';
import { login } from './actions';

const LoginButton = ({ isLoggedIn, login }) => {
  const handleLogin = () => {
    login();
  };

  return (
    <button onClick={handleLogin}>
      {isLoggedIn ? 'Logout' : 'Login'}
    </button>
  );
};

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

const mapDispatchToProps = {
  login,
};

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