분류 전체보기590 1-8. 라이프사이클 훅 template> div> div>{{ sampleData }}div> div> label for="">태어난 도시는?label> select name="" id=""> option value="" :key="city.code" v-for="city in cities"> {{ city.title }} option> select> div> div>template>script>export default { components: {}, data() { return { sampleData: '', cities: [], fnInterval: null } }, props: {}, s.. 2024. 9. 12. 1-7. computed와 watch computed computed는 data에 있는 key를 가지고, computed 안에 함수로 만들면 data 밑에 함수이름으로 있는 거랑 똑같은 효과를 가진다. watchcomputed와 유사한데, data에 선언되어 있는 key를 직접 감시하고 싶을 때 watch 사용하는 2가지 주요 이유특정 데이터 변수가 값이 변경이 발생했을 때, 특정 코드를 작성을 해서 실행을 해야 할 경우값의 변경사항을 계속 히스토리로 저장하고 싶을 때 2024. 9. 10. 1-6. 렌더링 조건 (v-if, v-show) v-if, v-else-if, v-else div v-if="userRole === 'G'"> button>조회button> div> div v-else-if="userRole === 'M'"> button>조회button> button>생성button> div> div v-else> button>조회button> button>생성button> button>삭제button> div> 조회 조회 생성 조회 생성 삭제 조회 생성 삭제 조회 생성 .. 2024. 9. 10. 1-5. 이벤트 클릭 이벤트button @click="increaseCounter">Add 1button> change 이벤트 select name="" id="" v-on:change="changeCity($event)" v-model="selectedCity" > ===도시선택=== {{ city.title }} {{ dong.dongTitle }} dong.cityCode === this.selectedCity )" > {{ dong.dongTitle }} keyup (ent.. 2024. 9. 10. 이전 1 ··· 3 4 5 6 7 8 9 ··· 148 다음
