导入模块时'as'是什么意思？

Question

当你导入多个东西是什么意思？所以例如，

import {
  BrowserRouter as Router,
  Route,
  Link
} from 'react-router-dom'

这只是来自 react router 的一个例子，javascript 文档只显示了"as"之后的一个声明的例子

看起来它正在将BrowserRouter导入为路由器，路由和链接，因此所有三个变量都引用了同一个库。如果我是对的，你为什么要这样做？

那么它和var Router, Route, Link = require('react-router-dom').BrowserRouter();一样吗？

Answer 1

语句

import {
  BrowserRouter as Router,
  Route,
  Link
} from 'react-router-dom'

有选择地从react-router-dom导入BrowserRouter、Route和Link。as Router语句使BrowserRouter在名称Router(而不是BrowserRouter(下可用。Route和Link的名称不会更改。

它相当于：

const Router = require("react-router-dom").BrowserRouter;
const Route = require("react-router-dom").Route;
const Link = require("react-router-dom").Link;

Answer 2

不，根本不是那样的！这是添加到导入/导出功能中的协调功能。

它和这个一样：

let tmp = require("react-router-dom")
let Router = tmp.BrowserRouter
let Route = tmp.Route
let Link = tmp.Link

或者简单地说：

const {BrowserRouter: Router, Route, Link} = require("react-router-dom")

Answer 3

import 语句中的关键字 as 允许您重命名要导入的模块。它等效于以下内容：

let Router = require("react-router-dom").BrowserRouter
let Route = require("react-router-dom").Route
let Link = require("react-router-dom").Link

Answer 4

导入是 ES6 的新语法，在您的示例中，它从模块"react-router-dom"加载三个类，BrowserRouter 的名称太长，因此您可以为其使用别名，称为路由器。

从"模块名称"导入 { member1 ， member2 作为别名 2 ， [...] };

常见的JS等效语法将是：

var Router = require('react-router-dom').BrowserRouter,
    Route = require('react-router-dom').Route,
    Link = require('react-router-dom').Link;

我在下面附上了一个链接：您将找到更多详细信息。

导入语法文档