배열 데이터 변경시 화면 갱신

데이터 변경 시 화면은 업데이트 되지 않지만, 데이터는 업데이트 되어있을때

 

1. 화면이 갱신 되지 않는 경우

1. 인덱스로 배열에 있는 항목을 직접 설정하는 경우
2. 배열 길이를 수정하는 경우

 

2. 강제 화면 갱신

this.$forceUpdate();

허나 이 방법은 IOS에서 작동하지 않았다.

그래서 3번 방법을 추천한다.

 

3. Key 값 지정

이 방법은  key값 변경시 화면이 업데이트 된다.

IOS에서도 잘 작동한다.

<swiper-slide v-for="item in categories" :key="active_attribute.attribCd" :class="['swiper-slide', search_catecode == item.cate_code ? 'active' : '']">
	<button @click="click_categories(item.cate_code)" type="button">{{item.cate_name}}</button>
</swiper-slide>