Выбор компонента со случайным стилем в React.js

У меня, наверное, есть невозможное, что я хотел бы сделать для своего сайта-портфолио. Я хочу использовать библиотеку React-Burger-Menu и импортировать все компоненты меню и выбирать один случайным образом при загрузке экрана. Я решил создать массив со всем импортом и использовать функцию math.random, чтобы посмотреть, сработает ли это. Конечно, нет. Я понимаю, что это, наверное, действительно глупо, но я думаю, было бы так здорово, если бы это сработало. Вот что у меня есть для случайной функции:

import { slide as Menu0 } from 'react-burger-menu';
import { stack as Menu1 } from 'react-burger-menu';
import { elastic as Menu2 } from 'react-burger-menu';
import { bubble as Menu3 } from 'react-burger-menu';
import { push as Menu4 } from 'react-burger-menu';
import { pushRotate as Menu5 } from 'react-burger-menu';
import { scaleDown as Menu6 } from 'react-burger-menu';
import { scaleRotate as Menu7 } from 'react-burger-menu';
import { fallDown as Menu8 } from 'react-burger-menu';
import { reveal as Menu9 } from 'react-burger-menu';

Menus = Array[Menu0, Menu1, Menu2, Menu3, Menu4, Menu5, Menu6, 
Menu7, Menu8, Menu9]

var Menu = Menus[Math.floor(Math.random() * Menus.length)];

export default Menu;

И здесь, как написано в документации, я оборачиваю свою навигацию тегами <Menu></Menu>. Вот код:

import Menu from './sidebar';
import Contact from "../pages/contact";
import Portfolio from "../pages/portfolio";
import Index from "../pages/index";
import "../styles/customnav.css";

class customnav extends Component {
  render() {
    return (
      <Menu>
        <HashRouter>
          <div>
           <nav className = "stroke">
            <ul className = "menu">
            <li>
              <NavLink className = "menu-item" to = "/">
                Home
            </NavLink>
            </li>
            <li>
              <NavLink className = "menu-item" to = "/portfolio">
                Portfolio
            </NavLink>
            </li>
            <li>
              <NavLink className = "menu-item" to = "/contact">
                Contact
            </NavLink>
            </li>
          </ul>

          <Route exact path = "/" component = {Index} />
          <Route path = "/portfolio" component = {Portfolio} />
          <Route path = "/contact" component = {Contact} />
          </nav>
         </div>
      </HashRouter>
     </Menu>
    );
 }
}

экспорт customnav по умолчанию;

Вот код ошибки: Cannot read property 'length' of undefined

Я понимаю, что это натянуто, но спасибо за помощь.