我想问最后一句话是什么意思和做(导出默认HelloWorld;),但我找不到任何教程。

// hello-world.jsx

import React from 'react';

class HelloWorld extends React.Component {
  render() {
    return <p>Hello, world!</p>;
  }
}

export default HelloWorld;

当前回答

在学习默认导出之前,让我们了解什么是导出和导入: 一般来说:导出是可以发送给其他人的商品和服务,类似地,函数组件中的导出意味着您让另一个脚本使用您的函数或组件。 导出默认值意味着您只想导出脚本中默认存在的一个值,以便其他脚本可以导入该值以供使用。 这对于代码的可重用性是非常必要的。

让我们看看如何使用它的代码

import react from 'react'

function Header() {
  return <p><b><h1>This is the Heading section</h1></b></p>;
}

export default Header;

因为这个导出可以像这样导入 import React from import reactDom import Header from './Header'; reactDom.render ( <> <标题/ > < / > . getelementbyid(根) ) 如果有人评论了导出部分,你会得到以下错误: 从react中导入react 函数头(){ return <p><b><h1>这是Heading section</h1></b></p>; } //输出默认头;

你会得到这样一个错误:

其他回答

Export default用于从脚本文件中导出单个类、函数或原语。

导出还可以写成

export default class HelloWorld extends React.Component {
  render() {
    return <p>Hello, world!</p>;
  }
}

你也可以把它写成函数分量

export default function HelloWorld() {
  return <p>Hello, world!</p>
}

用于在另一个脚本文件中导入此函数

import HelloWorld from './HelloWorld';

你不一定要把它导入HelloWorld,你可以给它任何名字,因为它是一个默认的导出

稍微讲一下出口

顾名思义,它用于从脚本文件或模块中导出函数、对象、类或表达式

Utiliites.js

export function cube(x) {
  return x * x * x;
}
export const foo = Math.PI + Math.SQRT2;

这可以导入并作为

App.js

import { cube, foo } from 'Utilities';
console.log(cube(3)); // 27
console.log(foo);    // 4.555806215962888

Or

import * as utilities from 'Utilities';
console.log(utilities.cube(3)); // 27
console.log(utilities.foo);    // 4.555806215962888

当使用export default时,这要简单得多。脚本文件只导出一件东西。 cube.js

export default function cube(x) {
  return x * x * x;
};

并用作 App.js

import Cube from 'cube';
console.log(Cube(3)); // 27

导出默认的HelloWorld;和import,例如import React from ' React '是ES6模块系统的一部分。

模块是一个自包含的单元,它可以使用导出向其他模块公开资产,并使用导入从其他模块获取资产。

在你的代码中:

import React from 'react'; // get the React object from the react module

class HelloWorld extends React.Component {
  render() {
    return <p>Hello, world!</p>;
  }
}

export default HelloWorld; // expose the HelloWorld component to other modules

在ES6中有两种类型的导出:

命名导出-例如,导出函数func(){}是一个命名导出,其名称为func。可以使用import {exportName}从'module';导入命名模块。在这种情况下,导入的名称应该与导出的名称相同。要在示例中导入func,你必须使用import {func} from 'module';。一个模块中可以有多个命名导出。

默认export -是将从模块导入的值,如果你使用简单的import语句import X from 'module'。X是将在本地赋给包含该值的变量的名称,它不需要像origin export那样命名。只能有一个默认导出。

一个模块可以同时包含命名导出和默认导出,并且可以使用import defaultExport、{namedExport1、namedExport3等方法将它们一起导入……} from 'module';。

在学习默认导出之前,让我们了解什么是导出和导入: 一般来说:导出是可以发送给其他人的商品和服务,类似地,函数组件中的导出意味着您让另一个脚本使用您的函数或组件。 导出默认值意味着您只想导出脚本中默认存在的一个值,以便其他脚本可以导入该值以供使用。 这对于代码的可重用性是非常必要的。

让我们看看如何使用它的代码

import react from 'react'

function Header() {
  return <p><b><h1>This is the Heading section</h1></b></p>;
}

export default Header;

因为这个导出可以像这样导入 import React from import reactDom import Header from './Header'; reactDom.render ( <> <标题/ > < / > . getelementbyid(根) ) 如果有人评论了导出部分,你会得到以下错误: 从react中导入react 函数头(){ return <p><b><h1>这是Heading section</h1></b></p>; } //输出默认头;

你会得到这样一个错误:

〇简单地说

export语句用于创建JavaScript模块 从模块导出函数、对象或基元值 其他程序可以通过import语句使用它们。

这里有一个链接可以让你更清楚地了解:MDN Web Docs

对于默认导出的最简单理解是

导出是ES6的特性,用于导出一个模块(文件),并在其他模块(文件)中使用它。

默认导出:

如果您只想从文件(模块)中导出一个对象(变量、函数、类),则默认导出是约定。 每个文件只能有一个默认导出,但不限于一个导出(Named export)。 当导入默认导出对象时,我们也可以重命名它。

导出或命名导出:

它用于导出同名的对象(变量、函数、类)。 它用于从一个文件中导出多个对象。 在另一个文件中导入它时不能重命名,它必须具有与导出时相同的名称,但我们可以使用as操作符创建它的别名。

在React, Vue和许多其他框架中,Export主要用于导出可重用的组件,以创建基于模块化的应用程序。