eact建立元件的三種方式:
1、函式式無狀態元件
2、es5方式react.createclass元件
3、es6方式extends react.component
三種建立方式的異同
1、函式式無狀態元件
(1)語法
function mycomponent(props) }
複製**
(2)特點
● 它是為了建立純展示元件,這種元件只負責根據傳入的props來展示,不涉及到state狀態的操作。
● 元件不能訪問this物件
● 不能訪問生命週期方法
(3)建議
如果可能,盡量使用無狀態元件
2、es5方式react.createclass元件
(1)語法
var mycreate = react.createclass(,
getinitialstate: function
() ;
}, render: function
() 複製**
(2)特點
這種方式比較陳舊,慢慢會被淘汰。
3、es6方式extends react.component
(1)語法
class inputcontroles6 extends react.component ;
// es6 類中函式必須手動繫結
this.handlechange = this.handlechange.bind(this);
} handlechange
() );
} render
() 複製**
(2)特點
● 成員函式不會自動繫結this,需要開發者手動繫結,否則this不能獲取當前元件例項物件。
● 狀態state是在constructor中像初始化。
React建立元件的三種方式
react常見的三種元件建立方式,具體如下 函式式定義的無狀態元件 es5原生方式react.createclass定義的元件 es6形式的extends react.component定義的元件 下面我們簡單說一下,這三種方式的用法 適用場合以及區別 import react,from react...
React三種建立元件的方式
react一共有三種建立方式 1 函式式定義的無狀態元件 2 es5原生方式react.createclass建立元件 3 es6繼承react.component方式 無狀態函式式元件是乙個只帶有render方法的函式,並且該元件是無狀態的,具體的形式如下 function hello props...
React建立元件的三種方式及其區別
react建立元件的三種方式及其區別 三種方式 函式式定義的無狀態元件es5原生方式react.createclass定義的元件 es6形式的extends react.component定義的元件 function hellocomponent props,context reactdom.ren...