react-native Image使用setNativeProps問題

在react-native中我們可以通過setNativeProps直接改動組件並出發局部刷新,不用使用props或state.
對此,官方的說明以及使用場景:


源碼中對Image中的組件屬性描述:

node_modules/react-native/Libraries/Image/Image.android.js



node_modules/react-native/Libraries/Image/Image.ios.js


通過以上內容,我們可以看到,在通過image使用setNativeProps直接修改圖片源的時候,在設置的時候還是不一樣的,Android端是src, IOS端是source,需要注意這一點

使用方法如下:

1.導入source

import resolveAssetSource from 'resolveAssetSource'

2.圖片組件

<Image
                  ref={'backImage'}
                  source={require('images/tabbar/back_white.png')}
              />

3.需要修改圖片的地方

let sourceAttr = Platform.OS === 'ios' ? 'source' : 'src';
this.refs.backImage.setNativeProps({
        [sourceAttr]: [resolveAssetSource(require('images/tabbar/back_black.png'))]
      })

ok,大功告成。

ps: react-native開發之旅,痛並快樂着。😀
最後,在此感謝:https://blog.csdn.net/lu1024188315/article/details/73733724

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章