Question

我有反应成分。代码如下

import React from 'react';
export const Header=()=>{

        return(
            <div>this test</div>
        );
}

这项工作没问题。

但是，如果我使用下面的代码，它会给我错误，导出声明或预期的表达。

import React from 'react';
const Header=()=>{

        return(
            <div>this test</div>
        );
 }

export  Header;

有人可以解释这两种出口之间的差异。提前谢谢。

Answer 1

如果您想要命名导出，则需要

export  { Header };

或

export  { Header as Smth };

Docs

export {name1，name2，...，nameN};

将{variable1导出为name1，将variable2导出为name2，...，nameN};

export let name1，name2，...，nameN; //也是var，函数

export let name1 = ...，name2 = ...，...，nameN; //也是var，const

export name只是无效的语法。

Answer 2

您可以使用

export default Header

让第二个工作。然后，您可以通过

从其他文件导入它

import Header from './Header'

甚至

import InsertAnythingHere from './Header'

鉴于文件的相对路径为./Header.js。

React组件中预期的导出声明或表达式。 Export方法之间的区别

2 个答案: