인프런 커뮤니티 질문&답변

주농님의 프로필 이미지

작성한 질문수

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

메인 화면 구현 - 3

배너가 나오지 않습니다.

21.06.17 16:43 작성

·

185

2

안녕하세요.

유익한 강의를 잘 보고 있습니다.

그런데 Carousel 컴포넌트가 표시가 되지 않습니다. 

<ScrollView>
        <Carousel
          data={banners}
          sliderWidth={Dimensions.get("window").width}
          itemWidth={Dimensions.get("window").width}
          itemHeight={200}
          renderItem={(obj) => {
            return (
              <TouchableOpacity
                onPress={() => {
                  Alert.alert("배너 클릭");
                }}
              >
                <Image
                  style={styles.bannerImage}
                  source={{ uri: `${API_URL}/${obj.item.imageUrl}` }}
                  resizeMode="contain"
                />
              </TouchableOpacity>
            );
          }}
        />
        <Text style={styles.headline}>판매되는 상품들</Text>

이와 같이 했는데 최상단에 판매되는 상품들부터 출력이 됩니다. 무엇이 잘못된 것일까요?

답변 2

2

주농님의 프로필 이미지
주농
질문자

2021. 06. 17. 16:47

console.log(`${API_URL}/${obj.item.imageUrl}`)로 출력되는 주소로 접근 시 정상적으로 접근이 되고 이미지도 출력됩니다.

1

그랩님의 프로필 이미지
그랩
지식공유자

2021. 06. 18. 21:28

banners라는  데이터가 제대로 들어가지 않은 것 같습니다!

useeffect 동작 코드 안에 console.log(banners)를 통해 banners 데이터를 확인해보시면 좋을 것 같습니다.

주농님의 프로필 이미지
주농
질문자

2021. 06. 18. 22:04

banners가 들어가지 않아도 obj는 정상적으로 들어가는 건가요?

그랩님의 프로필 이미지
그랩
지식공유자

2021. 06. 18. 22:07

실제 배너 데이터는 banners에 존재하니까 obj는 결국 banners로 부터 들어오게 됩니다.

만약 obj가 있다면 banners가 존재하는 거고, image쪽 style에 width,height가 정상적으로 들어있는지 확인해보시면 좋을 것 같습니다. 임의로 width height 값을 줘서 확인해보셔도 좋곘네요.

주농님의 프로필 이미지

작성한 질문수

질문하기