“导入”的这些不同用法分别代表什么？

Question

我是React的新手，对如何编写“导入”语句感到有些困惑。到目前为止，我已经看到了这4种样式：

/* This is very clear to me - Here no Problem */ import React from 'react';

/* What does "./" before ListContacts mean? */ import ListContacts from './ListContacts'

/* What "*" and "as" mean on this import statement? */ import * as ContactsAPI from './utils/ContactsAPI'

/*What does { } mean on this import statement? */ import { BrowserRouter } from 'react-router-dom'

非常感谢您的时间

Answer 1

import ListContacts from './ListContacts'

'./'表示它是不在node_modules中的组件。通常是您自己打造的。

import * as ContactsAPI from './utils/ContactsAPI'

*表示您正在导入所有命名的导出（因此您可以按名称使用它们）

import { BrowserRouter } from 'react-router-dom'

{BrowserRouter}意味着您仅是从多个命名导出中导入了名为BrowserRouter的组件。