菜单在 React JS 中无法正确渲染

Question

由于我是 React js 开发新手，所以我正在开发一个具有菜单和仪表板组件的 React 应用程序。我想根据用户角色呈现菜单。我从浏览器本地存储中保留的用户角色已正确设置。
菜单组件如下：

import { ReactSession } from 'react-client-session';
import dashboard from './dashboard';
import dashboard1 from './dashboard1';
import dashboard2 from './dashboard2';
import companies from './companies';
import investors from './investors';
import incubators from './incubators';

// ==============================|| MENU ITEMS ||============================== //

ReactSession.setStoreType("localStorage");
let role = ReactSession.get("role");
let menuItems = [];
{
    if (role == 3) {
        menuItems = {
            items: [dashboard1, companies]

        };
    }
    else if (role  == 2) {
        menuItems = {
            items: [dashboard, incubators]

        };
    }
    else if (role == 4) {
        menuItems = {
            items: [dashboard2, investors]

        };
    }
}
export default menuItems;

角色变量根据用户登录保留状态2、3、4，但只有手动刷新后菜单项才能正确呈现。如何解决这个问题？

Answer 1

我猜你需要 React Router，但这很难说，因为你没有发布完整的代码。