2016-08-25 74 views
1

PropTypes封裝在陣營物體作出反應源代碼,這種說法怎麼那麼是working-import語句在ES6的工作原理反應的組分

進口{} PropTypes從「反應」;

+0

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements /進口 –

+0

@FelixKling,我編輯了我的問題,不重複。請重新打開它。 –

+1

這是試圖將CommonJS模塊作爲ES6模塊導入的結果。在這種情況下,Babel會將導出對象的任何屬性視爲命名對象。查看該代碼的轉錄輸出:https://babeljs.io/repl/#?evaluate=false&lineWrap=false&presets=es2015%2Creact%2Cstage-2&code=import%20abc%2C%20%7Bfoo%7D%20from%20 'bar'%3B%0A%0Aconsole.log(abc%2C%20foo)%3B –

回答

1

模塊可以將部分代碼導出爲默認並命名爲exports。

例如,反應庫可能有這樣的事情

// named export 
export function PropTypes(){/*....*/} 
// defaul export 
export default function(){/*....*/} 

所以在導入時,我們可以輸入默認的出口僅僅作爲

import React from 'module'; 

要導入名爲出口,我們應該用花括號

import {PropTypes} from 'module';

只是我們合併上面的代碼行

import React, { PropTypes } from 'module' 

瞭解更多關於模塊here

+0

Thanks @ThunderBird for your input。但在React源代碼中,我看到PropTypes是React對象的一部分,所以想知道如何直接導入任何屬於其他對象的屬性,以及導入文件如何知道其定義的位置。 –

+1

Felix King發佈的鏈接應該爲您的問題提供答案,然後提供一些答案。大括號表示法被稱爲解構,對象和數組都可以使用類似的符號。以下內容絕對值得一讀:[Mozilla MDN:ES6解構任務](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment),[另一個有用的鏈接](http: //exploringjs.com/es6/ch_destructuring.html) – Pineda