反应打字稿FC

Question

下面的代码有什么区别？它们都工作正常，但我想知道哪个使用正确

import * as React from 'react';

type Props = {...some props..};

const App: React.FC<Props> = props => {
  return (...some content...)
}

和

import React from 'react';

type Props = {...some props..};

const App: React.FC<Props> = props => {
  return (...some content...)
}

和

import React, { FC } from 'react';

type Props = {...some props..};

const App: FC<Props> = props => {
  return (...some content...)
}

哪个变体错误或正确？

Answer 1

主要区别在于您进行导入的方式。

1. 您导入 React 对象并为其分配一个别名为“React”。之后，您使用别名导入的“属性”FC
2. 您导入 React 并使用导入的“属性”FC
3. 您导入 React，然后导入您稍后使用的命名导出 FC。

在这三种情况下，您将从模块 'react' 导出的默认值导入为 React，在第三种情况下，您还导入了命名的 export FC。

没有只有一种有效的方法可以做到，结果是一样的。