React Native setNativeProps使用

有時候我們需要直接改動組件并觸發(fā)局部的刷新,但不使用state或是props。 setNativeProps 方法可以理解為web的直接修改dom。使用該方法修改 View、 Text 等 RN自帶的組件 ,則不會觸發(fā)組件的 componentWillReceiveProps 、 shouldComponentUpdatecomponentWillUpdate 等組件生命周期中的方法。

使用例子

  class MyButton extends React.Component({
    setNativeProps(nativeProps) {
         this._root.setNativeProps({   //這里輸入你要修改的組件style
            height:48,
            backgroundColor:'red'
         });
    },
    render() {
         return (
            <View ref={component => this._root = component} {...this.props} style={styles.button}>
             <Text>{this.props.label}</Text>
        </View>
         )
    },
  });

避免和render方法的沖突

如果要更新一個由render方法來維護(hù)的屬性,則可能會碰到一些出人意料的bug。因為每一次組件重新渲染都可能引起屬性變化,這樣一來,之前通過setNativeProps所設(shè)定的值就被完全忽略和覆蓋掉了。

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

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

  • 深入JSX date:20170412筆記原文其實JSX是React.createElement(componen...
    gaoer1938閱讀 8,190評論 2 35
  • 原教程內(nèi)容詳見精益 React 學(xué)習(xí)指南,這只是我在學(xué)習(xí)過程中的一些閱讀筆記,個人覺得該教程講解深入淺出,比目前大...
    leonaxiong閱讀 2,954評論 1 18
  • 在React Native中使用組件來封裝界面模塊時,整個界面就是一個大的組件,開發(fā)過程就是不斷優(yōu)化和拆分界面組件...
    ITxiansheng閱讀 986評論 1 2
  • 2010-08-22 21:04 閱讀:447 文藝圈在外人眼中仿佛是一個大染缸,置身其中一定會失去本真的顏色!事...
    蝶戀谷谷主閱讀 14,257評論 0 1
  • “近因效應(yīng)”是指印象最深的記憶主要取決于離旁觀者最近的言語和行為。在與人交往、求職、交流等過程中,善于利用“近因效...
    LiveFuture閱讀 250評論 0 0

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