🔥

【React】default export、named export

に公開

App.jsx

// named exportのインポートの仕方
import ( Message ) from './components/Message';

// default exportのインポートの仕方
// 名前は自由につけれる
// 1ファイルに1つのみ使える
import Message from './components/Message'; 

export const App = () => {
...
};

components/Message.jsx

export const Message = (props) => { // named exportの書き方
    ...
    };

    return <p style={contentStyle}>{props.message}</p>;
};
const Message = (props) => {
    };

    return <p style={contentStyle}>{props.message}</p>;
};

export default Message; // default exportの書き方

Discussion