在 github 页面上部署 react 应用程序时出现错误：“react-dom.production.min.js:216 TypeError: Object(...) is not a function”答案

【问题标题】：Getting error : "react-dom.production.min.js:216 TypeError: Object(...) is not a function" while deploying react app on github pages在 github 页面上部署 react 应用程序时出现错误：“react-dom.production.min.js:216 TypeError: Object(...) is not a function”
【发布时间】：2022-01-27 07:42:05
【问题描述】：

我正在尝试部署我的 react 应用程序，但它没有正确呈现页面，它抛出以下错误：react-dom.production.min.js:216 TypeError: Object(...) is not a function。

我已将错误的屏幕截图和文件名与我的 github 链接链接在一起。[![

Expense.js

import { useState } from "react";
import "../css/Expenses.css";
import Card from "./Card";
import ExpenseItem from "./ExpenseItem";
import Filter from "./Filter";

function Expenses(props){
    let data = props.data;
    let [year,changeYear] = useState("2021");

    let data2 = data.filter(function(item){
      return(new Date(item.dates).getFullYear().toString() === year);
    })
    

    let setFilter = function(yearValue){
      changeYear(yearValue);
    }


    return(
     <Card className = "card">
     <div className="filter-section">
       <h3>Filter By Year</h3>
       <Filter sendData={setFilter} yearVal = {year} className='year-filter-card'/>
     </div>
     <div className="expense-wrap">
          {data2.length?
            data2.map(function(expItem) {
             return <ExpenseItem key={Math.random()*100000} item= {expItem} deleteMe={props.deleteMe}/>  
          }):
          <h2 className="nodata">No Expense Data</h2> 
    }
    </div>
     </Card>
    );
    
}

export default Expenses;

链接到我的仓库：https://github.com/AbhishekTomr/money-tracker

【问题讨论】：

标签： javascript reactjs github github-pages

【解决方案1】：

问题已解决，现在不得不使用这一行：

import React,{ useState } from "react";

【讨论】：