React / MaterialUI - импорт и экспорт с тем же именем

Question

Я хочу создать компонент с именем "Меню" и импортировать "Меню" из MaterialUI, что-то вроде этого:

import React, {Component} from 'react';
import Menu from '@material-ui/core/Menu';

class Menu extends Component {

    render() {
        return (
            <div>
                <Menu>
                    ...
                </Menu>
            </div>
        );
    }
}

export default Menu;

Как я могу это сделать? Я пытался сделать с импортом { Menu as OtherName} и т. Д., Но все время у меня есть ошибки.

Спасибо за советы.

Answer 1

У вас есть два варианта:

import { default as materialMenu } '@material-ui/core/Menu';

или же

export { myComponent as Menu };

Answer 2

Ниже приведены два сценария экспорта и импорта

Если вы экспортируете компонент по умолчанию, вы можете импортировать его как

   import Menu from ‘./Menu’;

Экспорт по умолчанию:

   export default class Menu extends Component{
       ........

       ........
   }

Если вы экспортируете компонент без значения по умолчанию, вы можете импортировать его как

   import {Menu} from ‘./Menu’;

Экспорт без дефолта:

   export class Menu extends Component{
       ........

      ........
   }