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

주농님의 프로필 이미지
주농

작성한 질문수

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

메인 화면 구현 - 3

배너가 나오지 않습니다.

작성

·

192

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

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

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

1

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

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

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

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

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

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

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

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

주농님의 프로필 이미지
주농

작성한 질문수

질문하기