В чем разница для экспорта по умолчанию / const / class extends?

Question

На их сайте есть очень хорошее руководство для Гэтсби.Все работает нормально, но у меня проблема с пониманием разницы в шаблонах запуска.

В чем разница между использованием различных компонентов реакции в шаблонах запуска?Почему они используют export default... для примера "Привет, мир", const IndesPage = () 0> ( для стартера по умолчанию и class BlogIndes extends React.Componenent для примера блога.

gatsby-starter-hello-world

export default () => <div>Hello world!</div>

gatsby-starter-default

const IndexPage = () => (
  ...
)

export default IndexPage

gatsby-starter-blog

class BlogIndex extends React.Component {
  render() {
    ...

    return (
      ...
    )
  }
}

export default BlogIndex

Answer 1

gatsby-starter-hello-world просто отобразите Hello Word

gatsby-starter-default - это компонент без состояния, цитата из документации React:

Эти компоненты не должны сохранять внутреннее состояние, не иметь резервных копий и не иметь методов жизненного цикла компонента. Они являются чисто функциональными преобразованиями их ввода, с нулевым шаблоном. Однако вы по-прежнему можете указывать .propTypes и .defaultProps, устанавливая их в качестве свойств функции, так же, как вы устанавливаете их в классе ES6.

gatsby-starter-blog является компонентом с состоянием Он имеет состояние, ловушки жизненного цикла, компонент класса должен использоваться всякий раз, когда вам нужно работать с состоянием ...

Надеюсь, это поможет