반응형
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- App.vue
- webpack
- HOC
- v-html
- 자바스크립트
- 자료구조
- Vue transition
- Vue.js
- 쉬운설명
- scss
- storybook
- express
- 리액트
- ES6
- State
- CSS
- TypeScript
- MySQL
- nodejs
- sass
- jsx
- input
- Wecode
- event
- Vue
- 댓글달기
- react
- mapGetters
- JavaScript
- vuex
Archives
- Today
- Total
목록multi thumb nail (1)
익명의 개발노트
[vue.js] 이미지 박스???? 썸네일 박스?? 구현하기
이미지 있을때 파란 화살표가 옆으로 한칸씩 밀리는 기능 구현하기?? 기본적으로 회색, 파란색 + 버튼은 전부 이미지이다. 이미지가 3개 이므로, 조건을 걸어주고 다르게 보여주기로 생각했다. 기본적으로 9개는 html단에서 for문으로 돌려서 생성했고, 그 안에 이미지의 조건은 따로 만든 flag 배열의 인덱스 값으로 걸어주었다. 맨 처음부터 파란색 + 버튼으로 시작하기때문에 flag 배열의 값은 아래와 같이 할당했다. data(){ return { imageListFlag:[1, 0, 0, 0, 0, 0, 0, 0, 0], } }, 플래그 값은 파란색 플러스 버튼은 1, 이미지가 들어오면 2, 아무것도 없으면 0으로 조건을 주었다. 디자이너의 의견으로 회색버튼은 클릭이 안되게 동작해야한다. 그리고 파란 ..
코딩일기/TIL
2020. 6. 10. 13:40