antd#Menu JavaScript Examples

The following examples show how to use antd#Menu. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.

Example #1

Source File: index.js From acy-dex-interface with MIT License

6 votes

render() {
    const { className } = this.props;
    const selectedLang = getLocale();
    const locales = ['zh-CN', 'zh-TW', 'en-US', 'pt-BR'];
    const languageLabels = {
      'zh-CN': '简体中文',
      'zh-TW': '繁体中文',
      'en-US': 'English',
      'pt-BR': 'Português',
    };
    const languageIcons = {
      'zh-CN': '??',
      'zh-TW': '??',
      'en-US': '??',
      'pt-BR': '??',
    };
    const langMenu = (
      <Menu className={styles.menu} selectedKeys={[selectedLang]} onClick={this.changeLang}>
        {locales.map(locale => (
          <Menu.Item key={locale}>
            <span role="img" aria-label={languageLabels[locale]}>
              {languageIcons[locale]}
            </span>{' '}
            {languageLabels[locale]}
          </Menu.Item>
        ))}
      </Menu>
    );
    return (
      <HeaderDropdown overlay={langMenu} placement="bottomRight">
        <span className={classNames(styles.dropDown, className)}>
          <Icon type="global" title={formatMessage({ id: 'navBar.lang' })} />
        </span>
      </HeaderDropdown>
    );
  }

Example #2

Source File: index.js From react_management_template with Apache License 2.0

6 votes

render() {
        return (
            <div>
                <div className="logo">
                    <img src="/assets/logo-ant.svg" alt=""/>
                    <h2>Ant Design of React</h2>   
                </div>

                <Menu theme="dark" defaultOpenKeys={['/admin/manage_blog']}  mode="inline">
                    {this.state.menuTreeNode}
                </Menu>
            </div>
        );
    }

Example #3

Source File: ExportTabSwitcher.js From volt-mx-tutorials with Apache License 2.0

6 votes

ExportTabSwitcher = ({ changeTab }) => {
  const [current, setCurrent] = useState("json");

  const handleClick = (e) => {
    changeTab(e.key);
    setCurrent(e.key);
  };

  return (
    <Menu onClick={handleClick} selectedKeys={[current]} mode="horizontal">
      <Menu.Item key="json">
        <Icon type="code" />
        JSON Values
      </Menu.Item>
    </Menu>
  );
}

Example #4

Source File: App.js From QiskitFlow with Apache License 2.0

6 votes

App = () => (
  <Layout>
    <Header style={{ position: 'fixed', zIndex: 1, width: '100%' }}>
      <div className="logo" />
      <Menu theme="light" mode="horizontal" defaultSelectedKeys={['1']}>
        <Menu.Item key="logo"><img className="ant-menu-item" src={"qiskitflow_logo.png"}/></Menu.Item>
        <Menu.Item key="1"> 
          Experiments
        </Menu.Item>
      </Menu>
    </Header>
    <Content className="site-layout" style={{ padding: '0 50px', marginTop: 64 }}>
      <Breadcrumb style={{ margin: '16px 0' }}>
        <Breadcrumb.Item>QiskitFlow</Breadcrumb.Item>
        <Breadcrumb.Item>Experiments</Breadcrumb.Item>
      </Breadcrumb>
      <div className="site-layout-background" style={{ padding: 24, minHeight: "80vh", backgroundColor: "white" }}>
       <ExperimentsPage />
      </div>
    </Content>
    <Footer style={{ textAlign: 'center' }}>QiskitFlow ©2020 </Footer>
  </Layout>
)

Example #5

Source File: AssetDropdown.js From dexwebapp with Apache License 2.0

6 votes

AssetMenu = styled(Menu)`
  background: ${(props) => props.theme.sidePanelBackground}!important;
  max-height: 260px;
  overflow-y: scroll;

  li {
    padding-left: 16px;
    border-bottom: 1px solid ${(props) => props.theme.seperator}!important;

    :hover {
      background: ${(props) => props.theme.primary} !important;
      color: ${(props) => props.theme.textBigButton} !important;
    }
  }
`

Example #6

Source File: App.jsx From micro-front-template with MIT License

6 votes

App = () => {
  const [refresh, setRefresh] = useState(0);
  const [selectedKeys, setSelectKeys] = useState(["react"]);
  useEffect(() => {
    const { pathname } = window.location;
    const menu = menus.find((item) => `${BASE_NAME}${item.route}` === pathname);
    setSelectKeys(() => [menu ? menu.key : "react"]);
  }, [refresh]);

  // 设置路由命名空间
  return (
    <Router basename={BASE_NAME}>
      <section>
        <Menu
          onClick={() => setRefresh((refresh) => ++refresh)}
          selectedKeys={selectedKeys}
          mode="horizontal"
        >
          {menus.map((item) => (
            <Menu.Item key={item.key}>
              <Link to={item.route}>{item.title}</Link>
            </Menu.Item>
          ))}
        </Menu>
        <Suspense fallback={null}>
          <Switch>
            <Route exact path="/" component={Home} />
            <Route path="/list" component={List} />
          </Switch>
        </Suspense>
      </section>
    </Router>
  );
}

Example #7

Source File: Nav.jsx From node-project-manager with Apache License 2.0

6 votes

Nav = ({ user }) => {
  return (
    <Menu mode="horizontal" className="navUsers">
      <Menu.Item>
      <HomeOutlined />
        <Link to="/Home">Inicio</Link>
      </Menu.Item>
      <Menu.Item key="app">
        <Link to="/Projects">
          <AppstoreOutlined />
          Proyectos
        </Link>
      </Menu.Item>
      <Menu.Item>
        <Link to="/Tecnologias">
          <SettingOutlined />
          Tecnologías
        </Link>
      </Menu.Item>
      {user.admin ? (
        <Menu.Item>
          <UserOutlined />
          <Link to="/AdminUser">Usuarios</Link>
        </Menu.Item>
      ) : null}
      {user.admin ? (
        <Menu.Item>
          <MailOutlined />
          <Link to="/Informes">Informes</Link>
        </Menu.Item>
      ) : null}
    </Menu>
  );
}

Example #8

Source File: index.js From online-test-platform with Apache License 2.0

6 votes

render() {
    const { className } = this.props;
    const selectedLang = getLocale();
    const locales = ['zh-CN', 'zh-TW', 'en-US', 'pt-BR'];
    const languageLabels = {
      'zh-CN': '简体中文',
      'zh-TW': '繁体中文',
      'en-US': 'English',
      'pt-BR': 'Português',
    };
    const languageIcons = {
      'zh-CN': '??',
      'zh-TW': '??',
      'en-US': '??',
      'pt-BR': '??',
    };
    const langMenu = (
      <Menu className={styles.menu} selectedKeys={[selectedLang]} onClick={this.changeLang}>
        {locales.map(locale => (
          <Menu.Item key={locale}>
            <span role="img" aria-label={languageLabels[locale]}>
              {languageIcons[locale]}
            </span>{' '}
            {languageLabels[locale]}
          </Menu.Item>
        ))}
      </Menu>
    );
    return (
      <HeaderDropdown overlay={langMenu} placement="bottomRight">
        <span className={classNames(styles.dropDown, className)}>
          <Icon type="global" title={formatMessage({ id: 'navBar.lang' })} />
        </span>
      </HeaderDropdown>
    );
  }

Example #9

Source File: LeftMenu.js From relay_08 with MIT License

6 votes

function LeftMenu(props) {
  return (
    <Menu mode={props.mode}>
      <Menu.Item key="mail">
        <a href="/">Home</a>
      </Menu.Item>
      {/* <Menu.Item key="mail">
        <a href="/list"></a>
      </Menu.Item> */}
      <SubMenu title={<a href="/list">사연게시판</a>}>
        {/* <MenuItemGroup title="Item 1">
          <Menu.Item key="setting:1">Option 1</Menu.Item>
          <Menu.Item key="setting:2">Option 2</Menu.Item>
        </MenuItemGroup>
        <MenuItemGroup title="Item 2">
          <Menu.Item key="setting:3">Option 3</Menu.Item>
          <Menu.Item key="setting:4">Option 4</Menu.Item>
        </MenuItemGroup> */}
      </SubMenu>
    </Menu>
  );
}

Example #10

Source File: AppLayout.jsx From React-Nest-Admin with MIT License

6 votes

menu = (signOut, history) => (
  <Menu>
    <Menu.Item>
      <a
        href="https://github.com/cnscorpions/React-Nest-Admin"
        target="_blank"
        rel="noopener noreferrer"
      >
        源码
      </a>
    </Menu.Item>
    <Menu.Item onClick={() => signOut(history)}>
      <span>退出</span>
    </Menu.Item>
  </Menu>
)

Example #11

Source File: SocialSharing.js From website with MIT License

6 votes

SocialSharing = ({ message }) => {
  const handleWpSharing = () => {
    const url = `whatsapp://send?text=${encodeURIComponent(message())}`;
    window.open(url, '_blank');
  };

  const handleFbSharing = () => {
    const url = `https://www.facebook.com/sharer/sharer.php?u=${document.location.href}`;
    window.open(url, '_blank');
  };

  const menu = (
    <Menu>
      <Menu.Item key='1' onClick={handleWpSharing}>
        <WhatsAppOutlined /> Via WhatsApp
      </Menu.Item>
      <Menu.Item key='2' onClick={handleFbSharing}>
        <FacebookOutlined /> Via Facebook
      </Menu.Item>
    </Menu>
  );
  return (
    <div className='social-sharing'>
      <Dropdown overlay={menu} trigger={['click', 'hover']}>
        <Button>
          <ShareAltOutlined /> Compartilhar
        </Button>
      </Dropdown>
    </div>
  );
}

Example #12

Source File: UserMenu.js From react-drag with MIT License

6 votes

UserMenuDropdown = props => {
  const onMenuClick = event => {
    const { key } = event;
    const { dispatch } = props;

    if (key === 'logout') {
      if (dispatch) {
        dispatch({
          type: 'user/logout',
        });
      }

      return;
    }
  };

  const UserMenu = () => {
    return (
      <Menu onClick={onMenuClick}>
        <Menu.Item key="logout">退出登陆</Menu.Item>
      </Menu>
    );
  };

  return (
    <Dropdown overlay={UserMenu} trigger={['click']}>
      <div>
        <UserOutlined style={{ fontSize: '22px' }} />
        用户中心 <DownOutlined />
      </div>
    </Dropdown>
  );
}

Example #13

Source File: headers.js From AgileTC with Apache License 2.0

6 votes

render() {
    const menu = (
      <Menu className="menu" onClick={this.handleDropdownClick}>
        <Menu.Item key="logout">
          <span>
            <Icon type="logout" />
            退出登录
          </span>
        </Menu.Item>
      </Menu>
    )
    return getCookies('username') ? (
      <Header style={{ zIndex: 9 }}>
        <a href="/" style={{ color: '#fff', fontSize: 24 }}>
          AgileTC
        </a>
        {getCookies('username') ? (
          <Dropdown overlay={menu} overlayClassName="dropStyle" placement="bottomLeft">
            <div className="user">
              <Icon type="user" className="userIcon" />
              <span className="username">{getCookies('username')}</span>
              <Icon type="down" className="dowm" />
            </div>
          </Dropdown>
        ) : (
          <a href="/login" className="loginCss">
            登录/注册
          </a>
        )}
      </Header>
    ) : null
  }

Example #14

Source File: Header.js From YApi-X with MIT License

6 votes

MenuUser = props => (
  <Menu theme="dark" className="user-menu">
    {Object.keys(HeaderMenu).map(key => {
      let item = HeaderMenu[key];
      const isAdmin = props.role === 'admin';
      if (item.adminFlag && !isAdmin) {
        return null;
      }
      return (
        <Menu.Item key={key}>
          {item.name === '个人中心' ? (
            <Link to={item.path + `/${props.uid}`}>
              <Icon type={item.icon} />
              {item.name}
            </Link>
          ) : (
            <Link to={item.path}>
              <Icon type={item.icon} />
              {item.name}
            </Link>
          )}
        </Menu.Item>
      );
    })}
    <Menu.Item key="9">
      <a onClick={props.logout}>
        <Icon type="logout" />退出
      </a>
    </Menu.Item>
  </Menu>
)

Example #15

Source File: index.js From gobench with Apache License 2.0

6 votes

ProjectManagement = () => {
  const menu = (
    <Menu selectable={false}>
      <Menu.ItemGroup title="Active">
        <Menu.Item>
          <Link to="/">Project Management</Link>
        </Menu.Item>
        <Menu.Item>
          <Link to="/">User Interface Development</Link>
        </Menu.Item>
        <Menu.Item>
          <Link to="/">Documentation</Link>
        </Menu.Item>
      </Menu.ItemGroup>
      <Menu.ItemGroup title="Inactive">
        <Menu.Item>
          <Link to="/">Marketing</Link>
        </Menu.Item>
      </Menu.ItemGroup>
      <Menu.Divider />
      <Menu.Item>
        <Link to="/">
          <i className="fe fe-settings mr-2" /> Settings
        </Link>
      </Menu.Item>
    </Menu>
  )
  return (
    <Dropdown overlay={menu} trigger={['click']} placement="bottomLeft">
      <div className={styles.dropdown}>
        <i className={`${styles.icon} fe fe-database`} />
        <span className="d-none d-xl-inline">
          <FormattedMessage id="topBar.projectManagement" />
        </span>
      </div>
    </Dropdown>
  )
}

Example #16

Source File: index.jsx From mixbox with GNU General Public License v3.0

6 votes

render() {
        const {
            theme,
            selectedKeys,
        } = this.props;
        return (
            <div styleName="header-menu">
                <Menu
                    selectedKeys={selectedKeys}
                    mode="horizontal"
                    theme={theme}
                >
                    {this.renderMenus()}
                </Menu>
            </div>
        );
    }

Example #17

Source File: index.js From camel-store-admin with Apache License 2.0

6 votes

render() {
    const { className } = this.props;
    const selectedLang = getLocale();
    const langMenu = (
      <Menu className={styles.menu} selectedKeys={[selectedLang]} onClick={this.changLang}>
        <Menu.Item key="zh-CN">
          <FormattedMessage id="lang.simplified-chinese" />
        </Menu.Item>
        <Menu.Item key="zh-TW">
          <FormattedMessage id="lang.traditional-chinese" />
        </Menu.Item>
        <Menu.Item key="en-US">
          <FormattedMessage id="lang.english" />
        </Menu.Item>
        <Menu.Item key="pt-BR">
          <FormattedMessage id="lang.portuguese" />
        </Menu.Item>
      </Menu>
    );
    return (
      <Dropdown overlay={langMenu}>
        <span className={classNames(styles.dropDown, className)}>
          <FormattedMessage id="navBar.lang" /> <Icon type="down" />
        </span>
      </Dropdown>
    );
  }

Example #18

Source File: index.js From discern with BSD 3-Clause "New" or "Revised" License

6 votes

render() {
    const {openKeys, selectedKeys} = this.state
    return (
      <Menu
        onOpenChange={this.onOpenChange}
        onClick={({key}) => this.setState({selectedKeys: [key]})}
        openKeys={openKeys}
        selectedKeys={selectedKeys}
        theme={this.props.theme ? this.props.theme : 'dark'}
        mode='inline'>
        {
          this.props.menus && this.props.menus.map(item => {
            return item.subs && item.subs.length > 0 ? this.renderSubMenu(item) : this.renderMenuItem(item)
          })
        }
      </Menu>
    )
  }

Example #19

Source File: index.js From zeroqueue with GNU General Public License v3.0

6 votes

export default function Sidebar({ defaultSelected }) {
  const [collapsed, setCollapsed] = useState(false);

  return (
    <Sider collapsible collapsed={collapsed} onCollapse={setCollapsed}>
      <div className="dashboard-logo">
        <Link href="/">
          <a className="dashboard-logo__link">{collapsed ? '⏰' : 'ZeroQueue ⏰'}</a>
        </Link>
      </div>
      <Menu theme="dark" defaultSelectedKeys={[defaultSelected || null]} mode="inline">
        <Menu.Item key="overview">
          <Link href="/dashboard">
            <a className="dashboard-logo__link">
              <BookOutlined />
              <span>Overview</span>
            </a>
          </Link>
        </Menu.Item>
        <Menu.Item key="settings">
          <Link href="/settings">
            <a className="dashboard-logo__link">
              <SettingOutlined />
              <span>Settings</span>
            </a>
          </Link>
        </Menu.Item>
      </Menu>
    </Sider>
  );
}

Example #20

Source File: GroupMenu.js From label-studio-frontend with Apache License 2.0

6 votes

GroupMenu = ({ regionStore }) => {
  return (
    <Menu selectedKeys={[regionStore.view]}>
      <Menu.Item key="regions">
        <div
          onClick={ev => {
            regionStore.setView("regions");
            ev.preventDefault();
            return false;
          }}
          style={{ width: "135px", display: "flex", justifyContent: "space-between" }}
        >
          <div>Regions</div>
        </div>
      </Menu.Item>
      <Menu.Item key="labels">
        <div
          onClick={ev => {
            regionStore.setView("labels");
            ev.preventDefault();
            return false;
          }}
          style={{ width: "135px", display: "flex", justifyContent: "space-between" }}
        >
          <div>Labels</div>
        </div>
      </Menu.Item>
    </Menu>
  );
}

Example #21

Source File: HeatmapSettings.jsx From ui with MIT License

6 votes

HeatmapSettings = (props) => {
  const { componentType } = props;

  const renderMenu = () => (
    <Menu size='small'>
      <SubMenu key='metadataTracks' title='Metadata tracks' icon={<></>} popupClassName='no-style-menu-item'>
        <NoStyleAntdMenuItem>
          <HeatmapMetadataTrackSettings componentType={componentType} />
        </NoStyleAntdMenuItem>
      </SubMenu>
      <SubMenu key='groupBy' title='Group by' icon={<></>}>
        <NoStyleAntdMenuItem>
          <HeatmapGroupBySettings componentType={componentType} />
        </NoStyleAntdMenuItem>
      </SubMenu>
    </Menu>
  );

  return (
    <Dropdown arrow type='link' size='small' overlay={renderMenu()} trigger={['click']}>
      <Tooltip title='Settings'>
        <Button
          type='text'
          icon={<SettingOutlined />}
          // these classes are added so that the settings button
          // is the same style as the remove button
          className='bp3-button bp3-minimal'
        />
      </Tooltip>
    </Dropdown>
  );
}

Example #22

Source File: index.jsx From erp-crm with MIT License

6 votes

function DropDownRowMenu({ row }) {
  const Show = () => {};
  function Edit() {}
  function Delete() {}
  return (
    <Menu style={{ width: 130 }}>
      <Menu.Item icon={<EyeOutlined />} onClick={Show}>
        Show
      </Menu.Item>
      <Menu.Item icon={<EditOutlined />} onClick={Edit}>
        Edit
      </Menu.Item>
      <Menu.Item icon={<DeleteOutlined />} onClick={Delete}>
        Delete
      </Menu.Item>
    </Menu>
  );
}

Example #23

Source File: index.jsx From starter-antd-admin-crud-auth-mern with MIT License

6 votes

function DropDownRowMenu({ row }) {
  const Show = () => {};
  function Edit() {}
  function Delete() {}
  return (
    <Menu style={{ width: 130 }}>
      <Menu.Item icon={<EyeOutlined />} onClick={Show}>
        Show
      </Menu.Item>
      <Menu.Item icon={<EditOutlined />} onClick={Edit}>
        Edit
      </Menu.Item>
      <Menu.Item icon={<DeleteOutlined />} onClick={Delete}>
        Delete
      </Menu.Item>
    </Menu>
  );
}

Example #24

Source File: index.js From aircon with GNU General Public License v3.0

6 votes

render() {
    const { openKeys, selectedKeys } = this.state;
    return (
      <Menu
        onOpenChange={this.onOpenChange}
        onClick={({ key }) => this.setState({ selectedKeys: [key] })}
        openKeys={openKeys}
        selectedKeys={selectedKeys}
        theme={this.props.theme ? this.props.theme : 'dark'}
        mode="inline"
        inlineCollapsed={false}
      >
        {this.props.menus &&
          this.props.menus.map((item) => {
            return item.subs && item.subs.length > 0
              ? this.renderSubMenu(item)
              : this.renderMenuItem(item);
          })}
      </Menu>
    );
  }

Example #25

Source File: RightContent.js From youdidao-unmanned-shop with MIT License

6 votes

render() {
    const { onMenuClick, theme } = this.props;
    const role = localStorage.getItem('role');
    console.log('GlobalHeaderRight render role', role);
    const menu = (
      <Menu className={styles.menu} selectedKeys={[]} onClick={onMenuClick}>
        <Menu.Item key="logout">
          <Icon type="logout" />
          <FormattedMessage id="menu.account.logout" defaultMessage="logout" />
        </Menu.Item>
      </Menu>
    );
    let className = styles.right;
    if (theme === 'dark') {
      className = `${styles.right}  ${styles.dark}`;
    }
    return (
      <div className={className}>
        <Tooltip title={formatMessage({ id: 'component.globalHeader.help' })}>
          <a
            target="_blank"
            href="https://pro.ant.design/docs/getting-started"
            rel="noopener noreferrer"
            className={styles.action}
          >
            <p style={{ color: '#666' }}>
              <Icon type="question-circle-o" /> 使用文档
            </p>
          </a>
        </Tooltip>
        <HeaderDropdown overlay={menu}>
          <span className={`${styles.action} ${styles.account}`}>
            <p>{role ? role.split('/')[1] : '管理员'}</p>
          </span>
        </HeaderDropdown>
      </div>
    );
  }

Example #26

Source File: BaseMenu.js From acy-dex-interface with MIT License

5 votes

{ SubMenu } = Menu

Example #27

Source File: AvatarDropdown.jsx From vpp with MIT License

5 votes

render() {
    const {
      currentUser = {
        avatar: '',
        name: '',
      },
      menu,
    } = this.props;
    const menuHeaderDropdown = (
      <Menu className={styles.menu} selectedKeys={[]} onClick={this.onMenuClick}>
        {menu && (
          <Menu.Item key="center">
            <UserOutlined />
            个人中心
          </Menu.Item>
        )}
        {menu && (
          <Menu.Item key="settings">
            <SettingOutlined />
            个人设置
          </Menu.Item>
        )}
        {menu && <Menu.Divider />}

        <Menu.Item key="logout">
          <LogoutOutlined />
          退出登录
        </Menu.Item>
      </Menu>
    );
    return currentUser && currentUser.name ? (
      <HeaderDropdown overlay={menuHeaderDropdown}>
        <span className={`${styles.action} ${styles.account}`}>
          <Avatar size="small" className={styles.avatar} src={currentUser.avatar} alt="avatar" />
          {/*<span className={`${styles.name} anticon`}>{currentUser.name}</span>*/}
        </span>
      </HeaderDropdown>
    ) : (
      <span className={`${styles.action} ${styles.account}`}>
        <Spin
          size="small"
          style={{
            marginLeft: 8,
            marginRight: 8,
          }}
        />
      </span>
    );
  }

Example #28

Source File: NotificationNav.js From video-journal-for-teams-fe with MIT License

5 votes

function NotificationNav(props) {
	const { fetchUserVideos, userId, videos, organizations, defaultOrganization, selectedOrganization } = props;

	useEffect(() => {
		socket.on("insertedFeedback", () => {
			fetchUserVideos(userId, organization_id);
		});
	}, []);

	let organization_id = "";

	if (typeof selectedOrganization === "undefined" || typeof defaultOrganization === "undefined") {
		organization_id = "";
	} else {
		organization_id = selectedOrganization.id ? selectedOrganization.id : defaultOrganization.id;
	}

	//getting feedback data for each video
	let feedback = videos.map((item) => {
		return item.feedback;
	});

	let userFeedback = gatherFeedback(feedback);

	// loop through Array or array for feedback and then obtain one single array
	function gatherFeedback(arr) {
		let newArray = [];
		for (let i = 0; i < arr.length; i++) {
			if (arr[i].length > 0) {
				for (let k = 0; k < arr[i].length; k++) {
					if (arr[i][k].viewed === false) {
						newArray.push(arr[i][k]);
					}
				}
			}
		}
		return newArray;
	}
	//populate feedback data into the menu itemm

	const menu = (
		<Menu>
			{userFeedback.length > 0 ? (
				userFeedback.map((item) => (
					<Menu.Item>
						<Link to={`/videos/${item.video_id}`}>
							{item.first_name} {item.last_name} left feedback on  {item.video_title}
						</Link>
					</Menu.Item>
				))
			) : (
				<Menu.Item>No new comments</Menu.Item>
			)}
		</Menu>
	);

	return (
		<>
			<Dropdown overlay={menu} className="margin-right">
				<a className="ant-dropdown-link" style={{ color: "grey" }} onClick={(e) => e.preventDefault()}>
					<Badge count={userFeedback.length} className="badger">
						<BellOutlined style={{ fontSize: "40px", color: "#FF7F50" }} />
					</Badge>
				</a>
			</Dropdown>
		</>
	);
}

Example #29

Source File: index.js From react_management_template with Apache License 2.0

5 votes

{ SubMenu } = Menu