진스

답부터 말하자면 vue.cmd create 출처 vue.js - vue cli 프로젝트 생성(feat. vue create 안될때 필독) 이전까지 nuxt.js 로 개발을 하다가 vue.js로 프로젝트를 만들기 위해 vue cli를 설치했다. vue cli 설치 설치는 단순하다. 터미널에 npm i -g @vue/cli 을 실행하면 설치 완료된다. 버전 확인 대부분의 블로 hjh0827.tistory.com 설치는 단순하다. 터미널에 npm i -g @vue/cli 을 실행하면 설치 완료된다. 버전 확인 대부분의 블로그에서 버전 확인을 하라고 하면 vue --version 을 실행하라고 하였다. vue : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Users\aa\AppData\Roaming\np..

간단히 라이브러리를 이용! npm install focus-trap focus-trap-vue focus-trap-vue Vue component to trap the focus within a DOM element www.npmjs.com 화면보기

외국인 이신가요? 내국인 외국인 생년월일을 입력해주세요.(예: 19990101) 법정생년월일 8자리 생년월일을 입력해주세요. methods: { nextPass(event){ var fb= document.querySelectorAll('.form_box input') var fbl= document.querySelectorAll('.form_box input').length const idx = Array.from(document.querySelectorAll('.form_box input')).indexOf(event.target); if(event.charCode == 13 && /Android/.test(navigator.userAgent)){ if(idx==(fbl-1)){ // console...

https://codepen.io/barney-parker/pen/OPyYqy Roulette Wheel It's a roulette wheel! Set some options, hit spin and see the result! needs to be put in to an object and made self-sufficient, but basically works!... codepen.io 출처 [interactive web] 이전에 만들었던 roulette 개선하기 이전에 만들었던 roulette는 실제 프로젝트에서 사용하기에는 다소 무리가 있다. 애초에 테스트 용도로 만들었기 때문이다. 실제 프로젝트에서 사용 가능하도록 몇가지를 수정하려고 한다. 항목 blueshw.github.io [intera..

이런식도 가능 or or 출처 Vue.js에선 element의 속성을 동적으로 처리할 때 v-bind라는 Directive를 사용한다. (Vue.js의 Directive는 다음에 정리) 일반적인 HTML 태그들의 속성을 바인딩할 경우가 생기는데, 그 대표적인 예로 img 태그의 src 속성이다. (src는 불러올 이미지의 경로를 지정해준다.) 특히 여러 이미지를 for문으로 한 번에 불러올 때 src를 바인딩 해줘야 한다. 다음과 같이 말이다. 위와 같이 :src 또는 v-bind:src를 써서 binding 해준다. (콜론은 v-bind: 의 sugar syntax라고 생각하면 된다. 즉, 축약어) 하지만 위와 같이 하면 이미지가 불러와지지 않는다. 왜 나오지 않는 것일까? 그 이유는 각 객체의 pro..

https://stackoverflow.com/questions/56918767/disable-check-of-camel-case-rule-in-eslint Disable check of camel case rule in eslint I have a large JavaScript file with multiple eslint rule violations. I am trying to disable them and address them one at a time. The code below shows that I can disable them all with no trouble, bu... stackoverflow.com fontSize:"10" 이 안되고 자꾸 font-size:"10"이 자동으로 되버린다..

출처 Vue 탭 UI 정말 자바스크립트나 제이쿼리를 사용했을때 이벤트를 바인드 하는거랑vue사용하면서 조금 다르게 생각을 하려다 보니 간단한 ui 조작 스크립트에서도 막히는게 많은 요즘이다! 구글에서 찾다 velog.io 간단하게 요약하자면 인덱스 번호를 저장하는 변수를 만들고 for문의 인덱스를 사용해 클릭했을때 변수에 숫자를 입력하게 되고 그 숫자에 맞는 컨텐츠를 v-show로 노출하는 것 이다. {{ tab }} export default { data () { return { currentTab: 0, tabList: [ '차량옵션', '업체정보', '후기/평점', '환불규정' ] } } }

출처 vue-awesome-swiper의 옵션에 대해 알아보자 negabaro.github.io 개요 이 포스트에서는 vue-awesone-swiper의 주요옵션에 대해 알아보자. 설치 방법은 아래 포스트를 참고 vue-awesome-swiper를 이용해 vue에서 swiper(Carousel)를 사용해보자 initialSlide(디폴트 0) 슬라이드의 시작 index번호 지정이 가능(디폴트는 0이다) direction(디폴트 horizontal) 슬라이드 방향을 정한다. 디폴트는 horizontal(수평)이다. 수직으로 변경할때 vertical을 지정해주면 된다. 수직시에는 height,max-height값을 지정해야한다. speed(디폴트 300) 슬라이드의 속도 밀리초로 지정 디폴트는 300이다. ..