使用导出默认新ClassName()时如何使用导入；
当我们使用export default关键字导出一个默认的类时，可以使用import关键字来导入这个类。具体的使用方法如下：
- 首先，在导出文件中使用
export default关键字导出默认的类。例如，我们有一个名为MyClass的类，可以使用以下代码导出它：
export default class MyClass {
// 类的定义
}- 然后，在导入文件中使用
import关键字导入这个默认的类。例如，我们有一个名为app.js的文件，想要导入MyClass类，可以使用以下代码：
import ClassName from './path/to/MyClass.js';这里的ClassName可以是任意的标识符，用来代表导入的类。
需要注意的是，导入的路径'./path/to/MyClass.js'需要根据实际情况进行修改，确保导入路径正确。
使用导入后，就可以在导入文件中使用ClassName来创建新的对象，调用MyClass中定义的方法和属性了。
关于导入和导出的更多详细信息，可以参考腾讯云的产品文档中与JavaScript相关的部分，如云函数文档或云开发文档等，具体根据你所使用的腾讯云产品进行查找。
相关·内容
2回答
你好，StackExchange社区。
我刚开始反应，在调用从另一个文件导出的函数时遇到了一些困难：
当我试图从表单调用此函数时，我会收到以下错误：
Attempted import error: 'PrivateRoute' is not exported from '../components/PrivateRoute'.
构成部分：
import React from "react";
import { Route, Redirect } from "react-router-dom";
function PrivateR
浏览 3提问于2020-11-04得票数 0
回答已采纳
1回答
我已经构建了一个react组件，我想从独立文件中的第二个组件中呈现该组件。
StoryStrap.react.js
var React = require('react');
import { Input, ButtonInput, Alert } from 'react-bootstrap';
var StoryStrap = React.createClass({
render: function() {
return (
<div>
<Input type="text&#
浏览 2提问于2015-12-09得票数 0
3回答
import React from 'react';
import PropTypes from 'prop-types';
function BlogTrends(props) {
BlogTrends.propTypes = {
data: PropTypes.array
};
return (
<div className="container blog-trends">
<h3>{props.data[0].head}</h3>
<h5
浏览 1提问于2019-02-21得票数 1
回答已采纳
由于某种原因，当我在InventoryItem组件中呈现InventoryPage组件时，dispatch作为未定义的返回，但是当我在任何其他组件中呈现它时，它工作得非常完美。
这是InventoryItem
// REDUX
import { connect } from 'react-redux';
import { addItem } from '../../../Redux/reducers/cart/actions/cartActions.js';
// REUSABLE COMPONENTS
import { Button } from '.
浏览 1提问于2021-07-14得票数 1
回答已采纳
8回答
我在使用create-react-app时遇到了这个问题，我得到了一个错误：
主目录不包含名为主目录的导出。
下面是我如何设置我的App.js文件：
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import { Home } from './layouts/Home'
class App extends Component {
render() {
return (
浏览 86提问于2017-05-25得票数 142
回答已采纳
我在运行一个玩笑测试时出错了
我有这个组件
import * as React from 'react';
import * as PropTypes from 'prop-types';
import { userActionsShape } from 'store/actions/user';
import Scss from './scss/index.scss'
export class LoginFormComponent extends React.Component {
constructor(props)
浏览 1提问于2018-02-25得票数 2
这是react中的代码，当我试图运行它时，它会产生错误。
错误:元素类型无效:需要一个字符串(用于内置组件)或一个类/函数(用于组合组件)，但got:未定义。您可能忘记从定义在其中的文件中导出组件，或者您可能混淆了默认导入和命名导入。
特别是在代码中显示了这一行。
import React, { Component } from "react";
import NewsItem from "./NewsItem";
import "../App.css";
import Spinner from "./Spinner";
i
浏览 2提问于2021-11-25得票数 2
回答已采纳
3回答
我有一个简单的文件，它从另一个文件中导入getAccesToken常量。但是，即使所有的东西都定义得很完美，我仍然会得到这个错误。我真的不知道为什么会发生这种事。我看起来类似的问题，但大多数都有花括号时，进口或其他什么。
这个问题是的续集。
这是我的文件，导入常量：
import React, {Component} from 'react';
import {Card, CardBody, CardHeader, Col, Row, Table} from 'reactstrap';
import getAccessToken from '../hel
浏览 2提问于2019-08-08得票数 6
回答已采纳
作为标题，我正在学习React，我决定第一次在我的应用程序中使用useContext函数。当我尝试获取useContext值时，无论如何它都会返回未定义的值。我在主文件中尝试了许多与.Provider的组合，没有什么改变。
App.js
import React, { useState } from 'react'
import './index.css'
import Data from './data.json'
import Comment from './Comment'
function App() {
cons
浏览 4提问于2022-06-12得票数 0
回答已采纳
我试图将Primereact连接到django后端项目，使用pass框架和corsheader将两者连接起来，但是当我试图获取或传递数据时，我一直会收到这个错误。
警告:错误的道具类型：addLead在LeadsForm中被标记为必需的，但它的值是undefined.Uncaught TypeError：_this.props.addLead不是函数LeadsForm.js:24
我的行动档案
import axios from 'axios';
import { GET_LEADS, ADD_LEAD } from './types
浏览 1提问于2020-03-03得票数 0
import React from 'react';
var nav1 = [
"SERVICE APP",
"ONLINE ORDER:+91 7303434043",
"CONTACT US",
"STATUS LOCATOR",
"MUMBAI",
"TRACK ORDER",
]
var nav2=[
{
'title':"HAFELE KARIA",
浏览 0提问于2021-07-09得票数 0
当试图通过将导入的项目转换为节点模块从我的另一个项目导入组件时，该组件以未定义的形式出现。这个组件使用了React路由器-Dom，它有自己定义的：
<Link to=""> <Link />
然后，将该组件导入到带有自己的路由器的父项目中，但是在编译时，会发现该组件未定义。
造成这种情况的原因是什么？
尝试：
从组件中移除所有react router导入，并将该组件作为纯html文件导出，从而成功导出组件。
从导出的组件中删除路由器，只留下链接包装器。
消除了对历史支柱的需要
出口部件：
export default fun
浏览 1提问于2019-06-11得票数 2
回答已采纳
这些数据是在它自己的.js文件中，我想要能够在我的应用程序中使用它，我如何才能？
const posts = [{
username: "lenard",
avi: "https://scontent-sjc2-1.cdninstagram.com/t51.2885-15/e35/20905417_730036297205402_7461293070093385728_n.jpg",
}]
我试着将它导入到我的App.js中，并将其作为道具传递下来
import posts from './d
浏览 0提问于2017-09-13得票数 6
回答已采纳
我是乞讨者和反应者，我在创建一个新的auth服务类对象时出错了。
const Auth = new Authentication();
误差
这个表达式是不可构造的。类型‘类型import("c:/react-js/portfolio/src/Services/IdentityServices/Authentication")’没有构造签名。
我的身份验证服务
import axios from 'axios';
class AuthenticationServices {
API_URL = 'https://localhost:44382/a
浏览 1提问于2021-12-21得票数 0
回答已采纳
每次我的选项卡组件父重发器，我的子组件重选器也是。
我的选项卡组件父级如下
import { useState } from "react";
import "./styles.scss";
import Tab from "./tab";
export default function App() {
const [selectTab, setSelectTab] = useState("a");
console.log("parent render");
return (
<div
浏览 0提问于2021-08-23得票数 3
回答已采纳
1回答
我在将我的HomePage(应用程序组件的子组件)组件连接到Redux store时遇到问题。在componentDidMount =>上，我尝试在文件的底部调用connect，并将从操作创建器文件导入的函数作为第二个参数传递，该函数将数据提取到后端，以便在React存储中设置数据。然而，我收到一个错误，说定义和导入的函数“不是一个函数”。我似乎不能通过我的componentDidMount电话。我也不能从这个组件访问存储。 我试着直接从我的组件中分派一个动作。我在调用的每个函数中都使用了调试器(尽管我没有通过ComponentDidMount。我还尝试使用withRouter来封装我
浏览 12提问于2019-09-19得票数 0
我得到了这个错误，不知道我错过了什么！
我有三个文件，HeaderOption.js，HeaderOptions.js，Search.js
这是HeaderOptions.js的代码
import HeaderOption from "./HeaderOption";
import DotsVerticalIcon from "@heroicons/react/outline";
import MapIcon from "@heroicons/react/outline";
import NewspaperIcon from "@
浏览 6提问于2022-07-31得票数 0
我试图导入ResponseForm，但是错误
编译失败。./src/components/projects/ProjectDetails.js试图导入错误：'ResponseForm‘不是从'./ResponseForm’导出的。
时有发生。
ResponseForm组件实际上存在。这条路似乎是正确的。我该怎么修呢？为什么会发生导入错误？
import {Component} from 'react'
import {connect} from 'react-redux'
import {createProject} from '
浏览 5提问于2021-03-08得票数 3
我是ReactJS的新手，所以请温文点。我正在使用ReactJS CDN和babelJS CDN。
我最初是使用JSON数组编写这段代码的。但我正在尝试将其从数组转换为JSON文件。此JSON文件将通过后台的微CMS保持最新。
当我的JSON像这样放在文档的顶部时，一切都运行得很好
var contactsData = [
{
"id": 1,
"name": "Name",
"job": "Job Title",
"email"
浏览 3提问于2018-01-22得票数 0
1回答
es6导出抛出解析错误:意外令牌
、、、、
App.js：
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
class App extends Component {
render() {
return (
<div className="App">
<header className="App-header">
浏览 1提问于2019-02-13得票数 0
回答已采纳
基本上，我试图在accounts.js中呈现一个页脚类。(实际上，扩展应该是.jsx，但它解决不了这里的问题。)
首先，我在accounts.jsx中导入页脚：
import React from "react";
import {Footer} from "../utils/footer.js";
import {SEEMIKO_LOGO} from "./const.js";
export default React.createClass({
render: function () {
return (
&
浏览 2提问于2016-04-08得票数 2
回答已采纳
1回答
我正在尝试构建类似于来自的Widget示例的代码。唯一的例外是从PostgreSQL数据库获取数据。
代码按其应有的方式列出组，但当我单击“编辑”时，会得到以下错误。
Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components). Check the render method of `AdminGroupList`
E
浏览 3提问于2016-06-28得票数 0
回答已采纳
1回答
我必须文件和保持代码干净，我去传递一个非常重要的功能，我将在其他文件中使用到自己的文件。但是我需要在主文件中调用这个函数，我不知道如何传递它。我已经被困在这里好几个小时了。所以我很感激你的想法。
这也是我想传递函数的文件：
import React, { Component } from 'react';
import './App.css';
import ERC20ABI from './blockchain/ERC20ABI.js';
import goweb3 from './blockchain/goweb3.js'
i
浏览 0提问于2018-11-27得票数 0
回答已采纳
我有一个
menu-item.component in src/components/menu-item/menu-item.component.jsxdirectory.component in src/components/directory/directory.component.jsx.
在menu-item.component中
import React from "react";
import withRouter from "react-router-dom";
import "./menu-item.styles.scss";
浏览 1提问于2020-02-13得票数 0
回答已采纳
1回答
我是新来的反应和反应。当用户单击列表项时，我试图触发一个函数。我似乎无法使它正确地附加到列表项目或流经减速机通过正确的行动类型。
组件
import React from 'react';
import LookDetail from './LookDetail';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux'
import selectLook from '../actions/looks'
im
浏览 2提问于2016-05-02得票数 1
回答已采纳
我确实有这个代码，我将第一次使用Cookie，但我得到下面的错误，谁可以帮助我解决这个问题？
“错误我面对:尝试导入错误：'react-cookie‘不包含默认导出(作为’Cookie‘导入)。”
import React from 'react';
import ReactDom from 'react-dom';
import './App.css';
import CountDown from './CountDown';
import Basket from './Basket
浏览 2提问于2018-10-29得票数 0
我想过滤我的购物车网站的财产。我在ReactJS项目中使用这里的redux工具包。我展示了产品。我使用这里() API在我的项目中列出我的产品。我想应用类别和价格的过滤器属性。我试过了，但过滤功能没有应用。请帮助我如何应用和使过滤器属性在redux-工具箱在Reactjs。下面是代码的所有文件。
productSlice.js
import { createSlice, createAsyncThunk } from "@reduxjs/toolkit";
import axios from "axios";
const baseURL = "ht
浏览 3提问于2022-11-05得票数 1
1回答
我正在将一些ES5代码转换为ES6。
我在文件StatesComponent.js中的某处有以下行
const STATES = require('../data/states.js');
我使用的是jspm，但它不支持require，所以我想使用ES6 import语法。
states.js文件包含以下内容：
exports.AU = [
{ value: 'australian-capital-territory', label: 'Australian Capital Territory', className: 'Stat
浏览 0提问于2016-01-12得票数 25
我在function中声明了这个功能组件，但是当我在另一个组件中导入这个组件时，它会引发一个错误，即这个组件是未定义的，当我将这个胖箭头 functional更改为普通ES5函数时，它就能工作了！为什么？
export default ActionButton = (props) => {
return (
<div>
<button>
<FontAwesomeIcon icon={faPlusSquare} className={classes.ButtonItem} />
浏览 2提问于2020-08-29得票数 1
3回答
**请让我知道我遗漏了什么，以便我可以在屏幕上呈现这些文件。我的目标是在屏幕上显示“教师列表”数据。但我一直收到找不到的错误代码。我一直收到这个错误码：**
Error Code:
Failed to compile.
src/Teachers.js
Line 5:18: 'TeacherList' is not defined no-undef
Search for the keywords to learn more about each error.
我在发布这个问题时遇到了问题，因为堆栈溢出一直在说“看起来你的帖子大部分都是代码。”因此，我在这里添加更多详
浏览 1提问于2021-05-24得票数 0
我试图设置一个新项目的测试与反应-创建-应用程序。现在看来，它使用的是React 16和Jest 3(据说它们有一些突破性的变化，或者可能是enzime)。我收到了一个类似于的错误
TypeError:调度不是App.componentDidMount上的一个函数(src/components/App.js:21:68)
import React from 'react';
import { Provider } from 'react-redux';
import { mount } from 'enzyme';
import {
浏览 2提问于2017-10-25得票数 4
回答已采纳
我正在我的react应用程序中实现一个上传文件下拉区域，我打算将它发送一个post请求到我的.NET Core来解析这个文件并将它保存到一个DB中。我正在使用这个作为指南，同时进行我自己的调整以适应我的项目规范，并且我不断地得到以下错误，我不知道如何修复：
警告: React.createElement: type不应为空、未定义、布尔或数字。它应该是一个字符串(用于DOM元素)或一个ReactClass (用于组合组件)。检查Upload的呈现方法。
此错误将阻止应用程序呈现组件。我研究了错误，并找到了以下答案，但我相信它们与我的问题无关。
请查看我的上传组件如下
浏览 1提问于2018-03-03得票数 2
回答已采纳
我开始了一个小的反应项目(初学者)，当我把我的'App‘组件切割成许多小组件，比如'header'，它就不能工作了。我一砍掉头，错误就开始发生了。并且说，标题css也没有加载。您可以在元素检查器中看到存在React组件，但它不希望加载与它关联的css。
// In App.js
import React from 'react';
import header_type from './header';
class App extends React.Component {
render() {
return
浏览 1提问于2022-06-20得票数 0
3回答
我对javascript和React都很陌生。我正在尝试从App.js呈现两个组件布局和Home。当我尝试单独从App.js呈现布局组件时。起作用了。但是当我在App.js中添加Home组件时。两者都不起作用。有人能帮我解决这个问题吗。下面是我的代码
App.js
import './App.scss';
import { Routes, Route} from 'react-router-dom'
import React from 'react';
import Layout from './Components/Layout'
浏览 6提问于2022-04-18得票数 0
回答已采纳
社区，我从一个页面呈现了多个组件，我收到的问题是：
[./src/App.js Attempted import error: 'Greeting' is not exported from './components/Home'.]
有人能告诉我为什么吗？
App.js
import "./App.css";
import { Home, Page, Greeting } from "./components/Home";
function App() {
return (
<div className=
浏览 0提问于2020-12-30得票数 0
我正在尝试用getstaticprops创建一个页面，但是我无法在其中包含我的navbar组件，因为console尖叫，out元素类型无效。我可以在正常的页面呈现过程中使用相同的navbar组件，而无需静态或服务器道具。我的静态道具页面
import {Navbar} from "../components/schema/Navbar"
export default function Dope({users}) {
console.log(users)
return (
<div>
{/* <Na
浏览 12提问于2022-06-28得票数 0
回答已采纳
由于某种原因，它找不到我的navbar.js文件，但它就在那里！？任何帮助都是值得感激的-
Compiled with problems:X
ERROR in ./src/App.js 5:0-41
Module not found: Error: Can't resolve './components/navbar' in 'C:\Users\ekrus\OneDrive\Desktop\honeycomb\honeycomb\client\src'
navbar.js文件：
import React from 'React';
i
浏览 4提问于2022-06-29得票数 -1
回答已采纳
我有一个功能组件：
export const Special = (props) => {
const [data, setData] = useState();
const [loading, setLoading] = useState(true);
const dataRead = (dt) => {
setData(dt);
setLoading(false);
}
useEffect(() => {
setLoading(true);
fetch("
浏览 3提问于2021-05-15得票数 0
我不想在组件中使用export default，而是使用export function..。
我的组件是这样构造的：
function Hero(props) {
return (
<section className="hero">
<div className="wrapper">
<div className="content">
<h1>{props.title}</h1>
浏览 0提问于2019-05-01得票数 0
回答已采纳
1回答
我已经创建了一个包含多个组件的包，并将其导出到它的index.js文件中。我正在尝试导入这些组件，并将其用于我们。如下所示： **package index.js**
export {default as F1Button } from './f1Button';
export {F1ButtonGroup} from './f1ButtonGroup';
export {F1Label} from './f1Label';
**Used it in New.js**
import { F1Button,
浏览 23提问于2020-01-03得票数 0
1回答
测试React Js根组件
、、、、
我正在导出react js根组件，如下所示
export default connect(mapStateToProps, mapDispatchToProps)(HomePage);
我在mocha测试文件中导入这个组件，如下所示
import HomePage from '../components/study/HomePage';
我在测试文件中创建组件，如下所示
beforeEach(() => {
const _store = createStore(rootReducer, initialState);
component = TestUti
浏览 0提问于2017-03-06得票数 1
我有反应打字记录svgr。一切看起来都很好。
{
test: /\.svg$/,
use: ['@svgr/webpack'],
},
import Logo from 'assets/icons/logo.svg';
<Logo className={iconClassName} />;
不喜欢这样。
TS2322: Type '{ className: string；}‘不能分配到键入'IntrinsicAttributes’。类型'IntrinsicAttributes‘上不存在其他属性'classNa
浏览 5提问于2021-03-03得票数 4
import React from 'react';
import { Layout } from '../components'
import '../styles/globals.css';
function MyApp({ Component, pageProps }) {
return (
<Layout>
<Component {...pageProps} />
</Layout>
)
}
export default MyApp
布局组件，我认为我正面临一个
浏览 7提问于2022-10-27得票数 -2
当我使用redux时，我得到了以下错误： TypeError: react__WEBPACK_IMPORTED_MODULE_2___default(...) is not a function 我该如何解决这个问题？我已经添加了下面的代码。 正在下面的组件中调用dispatch() import authAction from "../store/Auth";
import { useDispatch } from "react-redux";
const useStyles = makeStyles((theme) => ({
root: {
浏览 63提问于2021-09-12得票数 1
回答已采纳
1回答
当我单击登录按钮时，在创建AppRoutes.js并将一些路由移动到该文件之前，它正常工作。
TypeError:登录不是一个函数
这是代码结构。
这是启动app并将登录路由放在AppRoutes组件中的主文件。
app.js
import React, { Fragment, useEffect } from 'react'
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'
import Navbar from './comp
浏览 2提问于2020-05-29得票数 0
我在React中有一个简单的自定义组件，它接受字符串作为属性并显示文本。我正在尝试从位于我的src文件夹中的枚举js文件中的const加载我的文本内容。我将文件导入到父组件和index.js中，但当我尝试使用它时得到'titles' is not defined，如何正确使用文件中的常量？相关代码如下： import React from 'react';
import enums from '../../enums.js'
import CustomHeading from '../CustomHeading/CustomHeadin
浏览 5提问于2020-04-04得票数 0
2回答
反应中的可重用构件
、、、
我想使用样式组件在我的React应用程序中创建一个可重用的组件。我的问题是我搞错了
错误:元素类型无效:预期为字符串(用于内置组件)或类/函数(用于组合组件)，但未定义。您可能忘记从定义在其中的文件中导出组件，或者您可能混淆了默认导入和命名导入。
请检查我的代码如下：
import styled from 'styled-components'
import React from 'react'
const CustomSpinner = styled.svg`
animation: rotate 1s linear infinite;
width:
浏览 1提问于2021-07-25得票数 0
在这里我试着在我的web应用上编辑一篇文章。但当I显示×TypeError:无法读取未定义的属性时(读取'params‘会有人指出错误。我正在做这件事，这是一个教程。它工作得很好。但在我的代码中，它不起作用。我试着导入useParams并使用它。但是它说useParams不能在类组件中使用。有人能指出错误或给我一个修复吗？ import React, {Component} from 'react';
import axios from 'axios';
import {Dropdown} from "react-bootstrap";
浏览 17提问于2021-10-16得票数 0
我正在尝试在react框架的功能组件中使用useState。但是我得到了这个错误。原因是什么？
App.js
import useState from 'react';
import Header from './components/Header';
import TodoList from './components/TodoList';
import Form from './components/Form';
function App() {
const [todos, setTodos] = useState({
浏览 1提问于2021-01-07得票数 1
我是新来的。
我的主要组件的定义方式如下：
import React from "react";
import { useState } from "react";
export const Autocomplete = (props) => {
return (
<div className="wrapper">
hello
</div>
);
};
我得到了这个错误：
元素类型无效:预期为字符串(用于内置组件)或类/函数(用于组合组件)，但未定义。您可能忘记从定义在其中的文件中导出组件，或者您可能混淆了默认
浏览 3提问于2021-07-08得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
