react报错Element type is invalid: expected a string (for built-in components) or a class/function (for

react报错Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

login.js

import React, { Component } from ' react';
// import logo from '../logo.svg';
// import './App.css';
import ' ./static/bootstrap/css/bootstrap.min.css';
// import './static/bootstrap/font-awesome/css/font-awesome.css';
import ' ./static/bootstrap/css/animate.css';
import ' ./static/bootstrap/css/style.css';


class Login extends Component {

...

}

export default Login;


index.js

const React = require(' react');
const ReactDOM = require(' react-dom');
require(' ./css/index.css');
const App = require(' ./js/App');
const Login = require(' ./js/Login');
const registerServiceWorker = require(' ./js/registerServiceWorker');

ReactDOM. render(< Login />, document. getElementById(' root'));
registerServiceWorker();


修改;

在导入Login.js时,写上 .default

const Login = require(' ./js/Login'). default;

import React from "react"; import { Layout, Button, theme, Dropdown, Space, message, Avatar, } from "antd"; import type { MenuProps } from "antd"; import { MenuFoldOutlined, MenuUnfoldOutlined, UserOutlined, } from "@ant-design/icons"; import { useState } from "react"; const { Header } = Layout; const handleMenuClick: MenuProps["onClick"] = (e) => { message.info("Click on menu item."); console.log("click", e); }; const items: MenuProps["items"] = [ { label: "1st menu item", key: "1", icon: <UserOutlined />, }, { label: "2nd menu item", key: "2", icon: <UserOutlined />, }, { label: "退出", key: "3", icon: <UserOutlined />, danger: true, }, // { // label: "4rd menu item", // key: "4", // icon: <UserOutlined />, // danger: true, // disabled: true, // }, ]; const menuProps = { items, onClick: handleMenuClick, }; const TopHeader: React.FC = () => { const [collapsed, setCollapsed] = useState(false); const { token: { colorBgContainer }, } = theme.useToken(); return ( <Header style={{ padding: 0, background: colorBgContainer }}> <Button type="text" icon={collapsed ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />} onClick={() => setCollapsed(!collapsed)} style={{ fontSize: "16px", width: 64, height: 64, }} /> <div style={{ float: "right" }}> <span>欢迎xxx回来</span> <Dropdown menu={menuProps}> <Space wrap> <Avatar size={32} icon={<UserOutlined />} /> </Space> </Dropdown> </div> </Header> ); }; export default TopHeader; 报错:TaskQueue: Error with task : Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.
07-23
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值