【React】默认导出和具名导出

news/2024/12/5 17:51:09/

这是 JavaScript 里两个主要用来导出值的方式:默认导出和具名导出。一个文件里有且仅有一个 默认导出,但是可以有任意多个具名导出。

1.默认导出:

导出语句

export default function Button() {}

导入语句

import Button from './Button.js';

2.具名导出

导出语句

export function Button() {}

导入语句

import { Button } from './Button.js';

当使用默认导入时,你可以在 import 语句后面进行任意命名。比如 import Banana from './Button.js',如此你能获得与默认导出一致的内容。相反,对于具名导入,导入和导出的名字必须一致。这也是为什么称其为 具名 导入的原因!

通常,文件中仅包含一个组件时,人们会选择默认导出,而当文件中包含多个组件或某个值需要导出时,则会选择具名导出。 无论选择哪种方式,请记得给你的组件和相应的文件命名一个有意义的名字。我们不建议创建未命名的组件,比如 export default () => {},因为这样会使得调试变得异常困难。


http://www.ppmy.cn/news/1546563.html

相关文章

ACIS中wire与edge的区别是什么

在ACIS中,Wire表示没有附着在面上、连接在一起的有向边的集合,可以表示闭合曲线或一些理想化的对象;而Edge表示由两个顶点连接而成、具有方向属性的直线段或圆弧,用于定义曲线的拓扑结构。 • Wire(线框)&a…

MongoDB 详解:深入理解与探索

在当今的数据库领域,MongoDB 以其独特的特性和强大的功能,成为了众多开发者和企业的首选。本文将对 MongoDB 进行详细的介绍,包括其特点、应用场景、流程图以及源码分析。 一、MongoDB 概述 MongoDB 是一个基于分布式文件存储的开源数据库系…

传输协议设计与牧村摆动(Makimoto‘s Wave)

有一条活鱼和一条死鱼,你准备怎么做,你会将活鱼红烧或将死鱼清蒸吗?好的食材只需要最简单的烹饪,不好的食材才需要花活儿。 我此前的文字几乎都在阐述一个观点,广域网就是那条死鱼,数据中心则是那条活鱼。…

【报错记录】Steam迁移(移动)游戏报:移动以下应用的内容失败:XXX: 磁盘写入错误

前言 由于黑神话悟空,导致我的2TB的SSD系统盘快满了,我又买了一块4TB的SSD用来存放游戏,我就打算把之前C盘里的游戏移动到D盘,结果Steam移动游戏居然报错了,报的还是“磁盘写入错误”,如下图所示&#xff…

Unity3D UI 双击和长按

Unity3D 实现 UI 元素双击和长按功能。 UI 双击和长按 上一篇文章实现了拖拽接口,这篇文章来实现 UI 的双击和长按。 双击 创建脚本 UIDoubleClick.cs,创建一个 Image,并把脚本挂载到它身上。 在脚本中,继承 IPointerClickHa…

中安OCR电子行驶证、驾驶证识别,助力便捷出行与智慧交通

随着数字化技术在各行各业的深入应用,交通管理领域也迈入了新的时代。OCR电子行驶证和电子驾驶证的推出,不仅提升了车辆及驾驶证件管理的效率,更大大方便了车主出行。电子证件的普及,使得交通管理从“实体化”逐渐走向“数字化”&…

一文了解什么是腾讯云开发

一文了解什么是腾讯云开发 关于云开发的猜想腾讯云开发腾讯云开发的优势无服务跨平台轻松托管节约成本 快速上手云开发环境快速搭建管理后台 云开发体验 关于云开发的猜想 说到云开发,作为开发者的大家是否大概就有了想法。比如说过去的开发工作都是在自己本地电脑…

国内AI工具复现GPTs效果详解

国内AI工具复现GPTs效果详解 引言 近年来,随着人工智能技术的飞速发展,大型语言模型(LLM)逐渐成为研究和应用的热点。GPTs(Generative Pre-trained Transformer)系列模型,特别是GPT-4的推出&a…