<swiper :slidesPerView="'auto'" :spaceBetween="30" class="mySwiper" v-if="movieList">
<swiper-slide class="item_card" v-for="li in movieList" :key="li.id" @click="goDetail(li.id)">
<img :src="image(li.poster_path)" alt="Poster">
<img :src="image2(key3)" alt="Poster">
<p>{{li.poster_path}}</p>
<h3> {{ li.title }}</h3>
<p>{{key3}}</p>
</swiper-slide>
</swiper>
부모
data() {
return {
key3 : 'li.profile_path',
};
},
<img :src="image(li.poster_path)" alt="Poster">
<img :src="image(li.background_path)" alt="Poster">
<img :src="image(key3)" alt="Poster">
:image(데이터)
뿌려줄 데이터가 부모에 따라 달라져야 한다.
하지만 props로 가져온 텍스트는 그저 텍스트로 인식될 뿐이다.
<img src="https://image.tmdb.org/t/p/w300//z56bVX93oRG6uDeMACR7cXCnAbh.jpg" alt="Poster">
<img src="https://image.tmdb.org/t/p/w300/li.profile_path" alt="Poster">
정보 !!
computed , emit
for문을 또 돌려라
왜냐하면 이미 movieList에 있는 poster_path를 뽑는다는게 말이 안된다
부모 List 에서 movieList라는 배열을 자식에게 넘김
자식에서 movieList 찍으면 잘나오는데 로그로는 안찍힘(??????)
배열을 html상에서 불러오면 잘 나오는데
mounted가 문제인 것 같다.
mounted에서 콘솔 = 빈배열
디버깅모드에서 콘솔 = undefined
nextTick
https://cocobi.tistory.com/52