React / MaterialUI - import and export with the same name

user_5060370 0
Viewed 1006

I want to create component with name "Menu" and import "Menu" from MaterialUI, something like this:

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;

How can I do this? I tried to do with import { Menu as OtherName} etc but all time I have errors.

Thanks for advices.

react-material material-ui reactjs
2 Answers

You have two options:

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

or 

export { myComponent as Menu };
user_63481570

Below are the two scenarios of exporting and importing

If you export a component with default then you can import the component as 

   import Menu from ‘./Menu’;

Export with default:

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

       ........
   }

If you export a component without default then you can import the component as 

   import {Menu} from ‘./Menu’;

Export without default:

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

      ........
   }
user_69034970
Related