Простой компонент реагирующей пружины не работает в gatsby - недопустимый тип элемента: ожидал строку или класс / функцию, но получил: undefined - PullRequest
1 голос
/ 08 июня 2019

Испытание реагирующей пружины, используя простое руководство. Тем не менее, это не работает для меня. Вот мой код:

import React, { Component } from "react"
import { Spring } from "react-spring"
export default class Box extends Component {
  render() {
    return (
      <Spring
        from={{ opacity: 0, marginTop: -1000 }}
        to={{ opacity: 1, marginTop: 0 }}
      >
        {props => (
          <div style={props}>
            <p>Welcome to your new Gatsby site.</p>
            <p>Now go build something great.</p>
          </div>
        )}
      </Spring>
    )
  }
}

и вот ошибка

Недопустимый тип элемента: ожидается строка (для встроенных компонентов) или класс / функция (для составных компонентов), но получил: undefined. Вы скорее всего забыл экспортировать ваш компонент из файла, в котором он определен, или вы могли смешать импорт по умолчанию и имя.

Проверьте метод рендеринга Box.

Я использую реагирующую пружину в стандартном стартере Гэтсби и просто импортирую свой компонент Box следующим образом:

import React from "react"
import Layout from "../components/layout"
import Box from "../components/box"

const IndexPage = () => (
  <Layout>
    <Box />
  </Layout>
)

export default IndexPage
...