uri 이미지가 실제 기본 이미지보기로 렌더링되지 않습니다.

Question

React 네이티브를 사용하여 네이티브 개발에 참여하고 Android 응용 프로그램을 개발하는 것을 처음 접했습니다. 프로필 페이지에서 이름과 연락처 세부 정보를 아래에 표시하려고합니다.

return(
    <View style={{flex: 1}}> 
     <ScrollView contentContainerStyle={styles.contentContainer}> 
     <View style={styles.card}> 
     <View style={styles.horizontalCard}> 
     <Image 
      style={{width: 34, height: 34}} 
      source={{uri: 
     'http://test.abc.com/appdummyurl/images/mobile.png'}} 
     /> 
      <Text style={styles.header}>{this.state.user_email}</Text> 
     </View> 

     <View style={styles.horizontalCard}> 
     <Image 
      style={{width: 34, height: 34}} 
      source={{uri: 
     'http://test.abc.com/appdummyurl/images/images/profile.png'}} 
     /> 
      <Text style={styles.header}>{this.state.user_no}</Text> 
     </View> 

     </View>  

    </ScrollView> 
    <TouchableOpacity onPress={this.logOut}> 
      <View style={styles.BottonCard}> 
       <Text style={styles.Btntext}>LOG OUT</Text> 
      </View> 
      </TouchableOpacity> 
    </View> 
); 

모든 그것의 빈 공간을 보여주는 첫 번째 이미지는 첫 번째 이미지보기로로드를 제외하고는 두 번째 이미지를 위해 잘 작동한다. 그것을 이해하도록 도와주세요.

또한 이미지 URL 대신 변수를 사용할 수있는 방법을 알려주세요.

Answer 1

네트워크가 느리거나 이미지 경로가 올바르지 않거나 서버 문제 일 수 있습니다. 이 사례는 Google의 가짜 이미지 경로에서 테스트해야합니다. 예를 들면 다음과 같습니다.

<Image 
     style={{width: 100, height: 100}} 
     source={{uri: 
    'https://www.planwallpaper.com/static/images/9-credit-1.jpg' 
    }}/>