Question

我正在制作一个React应用。但是，第一次遇到这个异常错误。我正在将一个功能组件导入到我的App.js中并使用它。但是我在VSCode中得到了警告，尽管我已经在代码中使用了Recipe组件，但已声明该配方组件未被使用。这是我在浏览器中遇到的错误-

错误：元素类型无效：预期为字符串（对于内置组件）或类/函数（对于复合组件），但得到了：对象。您可能忘记了从定义文件中导出组件，或者可能混淆了默认导入和命名导入。

检查App的呈现方法。

这是我的Recipe.js

import React from 'react'

const Recipe = () => {
    return (
        <div>
            <h2>Title</h2>
            <h3>Calories</h3>
        </div>
    )
}

export default Recipe

这是我的App.js

import React from 'react';
import './App.css';
import Recipe from './Components/Recipe';


function App() {

  return(
    <div className="App">
        <form className="search-form">
          <input className="search-bar" type="text" name=""/>
          <button className="search-button" type="submit">Search</button>
        </form>

        <Recipe></Recipe>

    </div>
  )
}

export default App;

错误：元素类型无效：期望使用字符串（对于内置组件）或类/函数（对于复合组件），但得到：对象？

0 个答案: