React createClass參數(shù)詳解

var xxx = React.createClass({

? ?//調(diào)試輸出,jsx自動設(shè)置,調(diào)試時顯示的組件名

? ?displayName: "",

? ?//mixin屬性是一個數(shù)組,通過該數(shù)組可以共享一些復(fù)雜組件間的共用功能。

? ?mixins: [],

? ?propTypes: {

? ? ? ? // 驗證布爾值

? ? ? ?optionalBool: React.PropTypes.bool,

? ? ? ?// 驗證是一個函數(shù)

? ? ? ?optionalFunc: React.PropTypes.func,

? ? ? ?// 驗證是數(shù)字

? ? ? ?optionalNumber: React.PropTypes.number,

? ? ? ? // 自定義驗證器,驗證失敗需要返回一個 Error 對象。不要直接

? ? ? ?// 使用 `console.warn` 或拋異常,因為這樣 `oneOfType` 會失效。

? ? ? ?customProp: funciton(props, propName, componentName) {

? ? ? ? ? ? ? //自定義的驗證方法

? ? ? ? ? ? ?}

? ? },

? ?//statics對象使你可以定義一些靜態(tài)方法,這些靜態(tài)方法可以直接在組件上調(diào)用

? ?statics: {},

? ?//定義組件的參數(shù)-生命周期

? ?//創(chuàng)建期

? ?getDefaultProps: function(){},

? ?//創(chuàng)建期,在組件掛載前(即:創(chuàng)建期)調(diào)用一次,其返回值將做為this.state的初始值

? ?//設(shè)置props值,不可使用props,處于組件共享狀態(tài)

? ?getInitialState: function(){},

? ?//創(chuàng)建期,會在組件初始化(渲染完成)后立即調(diào)用一次

? ?//一般會使用this.getDOMNode(),獲取渲染原始DOM對象

? ?componentWillMount: function(){},

? ?//存在期,當組件感知到props屬性改變會調(diào)用此方法。render()方法將會在其后調(diào)用,

? ?//這時我們可以通 過this.setState()來阻止組件的再次渲染

? ? componentWillReceiveProps: function(nextProps){},

? ? //存在期,在組件收到新的props或state。在這個方法中,我們可以訪問組件的props和state屬性

? ? //通過這兩個屬性可以確認組件是否需要更新,如果不需要更新,則返回false,則其后的方法將 ? ? ? ?//不會在執(zhí)行

? ? shouldComponentUpdate: function(nextProps, nextState){},

? ? //存在期,會在收到新的props或state后調(diào)用

? ? componentWillUpdate: function(nextProps, nextState){},

? ?//存在期,會在組件重新渲染后立即被調(diào)用,當我們需要在組件重新渲染后操作DOM則需要使用 ? ? //這個方法

? ? componentDidUpdate: function(){},

? ? //銷毀&清理期,組件銷毀&清理期唯一調(diào)用的方法

? ? componentWillUnmount: function(){},

? ? //渲染組件,其返回值是一個單子級的組件

? ? render: function() {

? ? ? ? ?return(

? ? ? ? ? ? ? //null or flase,不返回任何東西

? ? ? ? ? ?)

? ? }

});

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容