React Native學習之 Image元件

2021-09-12 19:38:15 字數 706 閱讀 9056

為了使新的資源機制正常工作，require中的名字必須是乙個靜態字元創（不能使用變數！因為require是在編譯時期執行，而非執行時期執行！）

//錯誤


var icon = this.props.active ? 'my-icon-active' : 'my-icon-inactive';


//正確


var icon = this.props.active ? require('./my-icon-active.png') : require('my-icon-inactive.png');
注意：通過上述這種方式引用的資源包含的尺寸（寬高）資訊，如果你需要動態縮放（例如，通過flex），你可能必須手動在style屬性設定

我們需要給定的寬高或者知道的寬高比才能展示。

//正確


//錯誤
如果拿到的是的base64資料，此時可以使用'data:'格式來顯示，需要手動指定的尺寸

建議僅對非常小的使用base64資料，比如一些小圖示

//請記得指定寬高


dependencies

React Native發布APP之打包iOS應用

和打包react native android應用不同的是，我們無法通過命令一步進行匯出react native ios應用。我們需要將js部分的 和資源等打包匯出，然後通過xcode將其新增到ios專案中。匯出js bundle的命令 在react native專案的根目錄下執行 生成jsbund...

React Native發布APP之打包iOS應用

第一步 匯出js bundle包和資源 和打包react native android應用不同的是，我們無法通過命令一步進行匯出react native ios應用。我們需要將js部分的 和資源等打包匯出，然後通過xcode將其新增到ios專案中。匯出js bundle的命令 在react nati...

React Native學習筆記之2

1 如何建立乙個react native工程 首先進入到指定資料夾裡面，然後在終端執行react native init reactnativeproject 其中reactnativeproject為工程的名稱 2 如何運用除錯 可以先安裝chrome瀏覽器的外掛程式react developer...