在原生應用程序中動態顯示來自Firebase的圖像

我已經從Firebase提取數據並顯示它們。現在我需要顯示圖像。在火力數據庫我有同樣的結構如下圖在原生應用程序中動態顯示來自Firebase的圖像

的形象和我有一個包含有類似的一個例子「Carl.png」我提取照片中的內容完全相同的名稱的所有圖片我的項目下的文件夾並與路徑的其餘部分結合使用：「Myproject/img /」+ photo +「。png」，並在屏幕上正確顯示。但當我試圖影響它的形象我得到的錯誤。這裏是我試過

<Image style={{width: 50, height: 50}} source={{uri : (this.props.item.imageName)}}> </Image>

的代碼，我得到這個，如果我試圖把在<Image style={{width: 50, height: 50}} source={{ uri: <Text> this.props.item.imageName </Text> }}> </Image>我得到這個，如果我把這個代碼source={require(this.props.item.imageName)}這裏是我得到：U nknown命名模塊

來源

2017-04-03 user3521011

嘗試 <Image style={{width: 50, height: 50}} source={{uri : (this.props.item.imageName)}} />

你得開&關閉標記之間的空間。

來源

2017-04-03 17:56:22 nehvaleem

嗨，謝謝你..我試過你的解決方案，但我什麼也沒有在屏幕上，我甚至沒有得到一個錯誤..但在控制檯上，我得到這個：找不到名爲projectName/img/photos/Carl.png的圖片..任何想法 – user3521011

@ user3521011您確定您使用的是可從互聯網訪問的完整絕對網址嗎？ – nehvaleem

不，實際上它不是來自互聯網：它是我項目下的一個文件夾，其中包含Firebase數據庫中所有具有完全相同名稱的照片。但是，每一次，我從數據庫中獲得一個項目，我還提取它的照片（如上例中的Carl），然後將其與（我的項目下的路徑）+ photo +（.png） – user3521011

嘗試使用需要，因爲你是從本地存儲加載它加載它，所以你的源屬性變爲：源= {要求（「./ IMG /‘+照片+’巴」）}

來源

2017-04-04 16:45:18

連接起來謝謝.. * *我只是現在嘗試，我得到未知的命名模塊'projectName/img/photos/Carl.png'** ..是否有任何其他解決方案？ – user3521011

實際，React native不支持動態圖像，即使它們存儲在本地，您只需要使其名稱動態變化即可。所以，我不得不使用的唯一解決方案是使用一個巨大的開關情況下，這裏的代碼我使用：

 switch (item.name) { 
       case 'carl': 
        return (
         <Image source{require('pathUnderProject/carl.png')}/> 
        ); 
... 
       default: 
        return (
         <View > 
          <Text>{'Null'}</Text> 
         </View> 
        );

我知道這是不是最好的解決辦法，但至少我敢肯定它的正常工作它不會在生產環境中破壞

來源

2017-04-25 10:25:48 user3521011

在原生應用程序中動態顯示來自Firebase的圖像

回答

相關問題