建立元件的方式

2021-08-22 19:15:14 字數 649 閱讀 3186

第1種 -建立元件的方式

使用建構函式來建立元件,如果要接收外界傳遞的資料,需要在 建構函式的引數列表中使用props來接收;

必須要向外return乙個合法的jsx建立的虛擬dom;

function

hello ()

// 使用元件並 為元件傳遞 props 資料

// 在建構函式中,使用 props 形參,接收外界 傳遞過來的資料

function

hello(props) --- ---

}

父元件向子元件傳遞資料

使用屬性擴散傳遞資料

將元件封裝到單獨的檔案中

注意:元件的名稱首字母必須是大寫

在匯入元件的時候,如何省略元件的.jsx字尾名:

// 開啟 webpack.config.js ,並在匯出的配置物件中,新增 如下節點:

resolve:

}

6 在匯入元件的時候,配置和使用@路徑符號

第2種 - 建立元件的方式

使用 class 關鍵字來建立元件

es6 中 class 關鍵字,是實現物件導向程式設計的新形式

react建立元件的方式

react建立元件的方式 工廠 無狀態 函式 最簡潔,推薦使用 function component es6語法,複雜元件,推薦使用 定義的元件類component必須繼承react的核心元件類component,extends是繼承的意思,render 方法是react最常用的方法 class c...

Vue 建立元件的方式

h1 這是通過 template 元素,在外部定義的元件結構,這個方式,有 的智慧型提示和高亮 h1 div template template id tmpl2 h1 這是私有的 login 元件,在外部定義的元件結構,這個方式,有 的智慧型提示和高亮 h1 template script 如果使...

react的元件建立的方式

相對vue來說,react的元件的建立方式,不再安裝全域性和區域性劃分。大致分為 函式式定義的無狀態元件es5原生方式react.createclass定義的元件 es6形式的extends react.component定義的元件 建立純展示元件,只負責根據傳入的props來展示,不涉及到要sta...