React Antd Radio 组件实现页面跳转并优化导航响应速度

该代码使用 React 和 Antd 的 Radio 组件实现页面跳转功能。通过 useState 和 useHistory Hook 管理页面状态和路由，并利用 useEffect Hook 监听 mode 状态变化，实现页面跳转的实时响应。

import React, { useState, useEffect } from 'react';
import { useHistory } from 'react-router-dom';
import { Radio } from 'antd';

const MenuIndex = () => {
  const [mode, setMode] = useState('license');
  const history = useHistory();

  const handleModeChange = (e) => {
    setMode(e.target.value);
  };

  const changePathHandle = () => {
    history.push(`/home/admin/basicInfo/list/${mode}`);
  };

  useEffect(() => {
    changePathHandle();
  }, [mode]);

  return (
    <div className='nf-page-tabChange'>
      <Radio.Group onChange={handleModeChange} value={mode}>
        <Radio.Button value='license'>营业执照</Radio.Button>
        <Radio.Button value='legalPersonInfo'>法人身份证</Radio.Button>
        <Radio.Button value='billingInfo'>开票信息</Radio.Button>
      </Radio.Group>
    </div>
  );
};

export default MenuIndex;

代码分析：

1. 使用 useState Hook 初始化 mode 状态，并定义 setMode 函数用于更新状态。
2. 使用 useHistory Hook 获取路由对象，用于实现页面跳转。
3. handleModeChange 函数在 Radio 组件选中时触发，更新 mode 状态。
4. changePathHandle 函数用于根据 mode 状态更新路由路径，实现页面跳转。
5. 使用 useEffect Hook 监听 mode 状态变化，并在状态变化时调用 changePathHandle 函数，实现页面跳转的实时响应。

优化导航响应速度：

代码中使用 useEffect Hook 监听 mode 状态变化，并在状态变化时调用 changePathHandle 函数，确保页面跳转的实时响应。

注意：

1. 确保已经安装了 react-router-dom 和 antd 库。
2. 将代码中的 /home/admin/basicInfo/list 替换为实际的路由路径。

通过以上代码和优化，可以实现使用 React 和 Antd 的 Radio 组件实现页面跳转功能，并优化导航响应速度，使页面跳转更加流畅。