반응형 TRANSITION1 [vue2] css position > transition 사용하기 카테고리 더 보기가 접혀있을 때는 최소 아이템 4개를 보여주고, 더보기를 눌렀을 때 있는 아이템 갯수만큼 4개씩 배치된 리스트가 출력되는 형식의 모습이다. 데이터가 없는 상태라고 가정했을 때 하드코딩으로 리스트를 데이터에 넣어서 구현을 해봤다. setExpand() { this.expandStatus = !this.expandStatus const refHeight = this.$refs.prdtList.clientHeight + 24 if (!this.expandStatus) { this.foldStyle.top = '106px' } else { this.foldStyle.top = `${refHeight}px` } }, clientHeight로 리스트의 높이값과 + 기본적으로 열려있는 값을 refHe.. 2023. 12. 19. 이전 1 다음 728x90 반응형