익명의 개발노트

이미지 있을때 파란 화살표가 옆으로 한칸씩 밀리는 기능 구현하기?? 기본적으로 회색, 파란색 + 버튼은 전부 이미지이다. 이미지가 3개 이므로, 조건을 걸어주고 다르게 보여주기로 생각했다. 기본적으로 9개는 html단에서 for문으로 돌려서 생성했고, 그 안에 이미지의 조건은 따로 만든 flag 배열의 인덱스 값으로 걸어주었다. 맨 처음부터 파란색 + 버튼으로 시작하기때문에 flag 배열의 값은 아래와 같이 할당했다. data(){ return { imageListFlag:[1, 0, 0, 0, 0, 0, 0, 0, 0], } }, 플래그 값은 파란색 플러스 버튼은 1, 이미지가 들어오면 2, 아무것도 없으면 0으로 조건을 주었다. 디자이너의 의견으로 회색버튼은 클릭이 안되게 동작해야한다. 그리고 파란 ..

vue tooltip 라이브러리 중에 vuetify를 제외하고 쓸만한 라이브러리가 v-tooltip 밖에 없는 듯... 1. 설치 npm install --save v-tooltip 2. 글로벌 등록 //main.js import Vue from 'vue' import VTooltip from 'v-tooltip' //추가 Vue.use(VTooltip); //추가 new Vue({ router, store, render: h => h(App) }).$mount('#app') 3. 스타일 적용하기 공식문서에 일반 css 와 pre-processor 방식인 sass, less 방식이 있다. 공식문서에는 자세히 안나와 있어서, 전역 스타일 안에다가 아래 코드를 넣었는데 작동하지 않았고, 개발자 도구를 열고 ..

고차함수는 다른 함수를 반환하는 함수이다. const discounter = discount => { return price => { return price * (1-discount); }; }; const tenPercentOff = discounter(0.1); tenPercentOff(100); //90 아래와 같이 화살표함수를 이용해서 사용가능 const discounter = discount => price => price *(1-discount); discounter(0.1)(100) //90 이 방법은 두개의 다른 매개 변수를 가진 함수를 단일함수로 변환할때 유용하다고 한다. 출처: 자바스크립트 코딩의 기술