如何正確地在JS中導入別名？

Question

我有基本的反應課：

import React, { Component } from 'react';

class Children extends Component {
    render() {
        return (
            <h1>Children</h1>
        );
    }
}

export default Children;

位於/scenes/Stash/Children/Children 。 我想像StashChildren一樣import它。

import {Children as StashChildren} from './scenes/Stash/Children/Children';

但是我得到：

45：88-101“在'_ / scenes / Stash / Children / Children'中找不到導出'Children'（作為'StashChildren'導入）

如果我只是做：

import {Children} from './scenes/Stash/Children/Children';

一切正常。

Answer 1

您可以通過以下任一方式導入默認導出

import StashChildren from './scenes/Stash/Children/Children'

要么

import {default as StashChildren} from './Children';

您只需要在所需名稱下導入默認值即可。

Answer 2

由於已將子組件導出為默認導出，因此可以使用任何名稱導入子組件。 所以你只需要

import StashChildren from './scenes/Stash/Children/Children';

選中此選項何時應在導入中使用方括號以了解更多詳細信息

Answer 3

由於您要導出默認值，因此可以import StashChildren from './scenes/Stash/Children/Children';調用import StashChildren from './scenes/Stash/Children/Children';

對於別名，只需除去括號：

import Children as StashChildren from './scenes/Stash/Children/Children';