反应出口功能与出口常量：FC

Question

所以我只是想知道使用一个而不是另一个的区别或原因是什么...

export function Name() { return <div /> }

对

export const Name = () => { return <div /> }

Answer 1

实用上（即在 React 中构建功能组件时），使用命名函数与将箭头函数导出为命名导出的值没有区别。

在这两种情况下，您导出的函数（希望）不使用 this 关键字。因此，您不必担心函数和箭头函数之间最重要的区别之一，即您是否需要 this 进行词法绑定还是动态绑定。

此外，由于您将变量分配给箭头函数，因此您不必担心在调试箭头函数时会降低可追溯性。 JavaScript 能够推断函数名称。

您可能知道，如果您将组件导出为默认导出会很重要，因为这样您就无法为默认导出指定名称。您需要使用两行：

const Name = () => { return <div /> }
export default Name

react export function vs export const: FC