React - Как экспортировать чистый компонент без гражданства

Как я могу экспортировать чистый фиктивный компонент без имени?

Если я использую класс, это работает:

import React, { Component } from 'react';

export default class Header extends Component {
    render(){
        return <pre>Header</pre>
    }
}

Однако, если я использую чистую функцию, я не могу заставить ее работать.

import React, { Component } from 'react';
export default const Header = () => {
    return <pre>Header</pre>
}

Я пропустил что-то основное?

Ответы

Ответ 1

ES6 не разрешает export default const. Сначала необходимо объявить константу, а затем экспортировать ее:

const Header = () => {
  return <pre>Header</pre>
}
export default Header ;

Это ограничение существует, чтобы избежать запрета на использование export default a, b, c;: только по одной переменной или объекту можно экспортировать по умолчанию

Ответ 2

Как примечание. Вы можете технически export default, не объявляя сначала переменную.

export default () => (
  <pre>Header</pre>
)