진스

vue 를 이용해 핸드폰에서도 이용가능한 반응형 웹을 만들 때, 이미지 슬라이더를 구현해야 할 때가 있으실 겁니다. 스와이프를 통해 여러 이미지를 리스트 형식으로 보여주는 기능을 구현하기 위해 vue-tiny-slider 모듈을 사용해보았습니다. 아래는 데모입니다. 위의 데모는 3개의 이미지를 슬라이더로 만들어 보여주는 예제입니다. 그럼 자세한 사용방법에 대해 알아볼까요? 사용하기 전 준비 vue-tiny-slider 를 사용하기 전 모듈을 먼저 설치해야 합니다. 저는 npm 을 주로 사용하기 때문에 npm 을 이용해서 모듈을 설치하도록 하겠습니다. 1 2 3 $npm i vue-tiny-slider --save // --save 는 package.json 에 자동으로 추가되도록 하기 위한 옵션입니다. ..

github.com/vuejs/awesome-vue vuejs/awesome-vue 🎉 A curated list of awesome things related to Vue.js - vuejs/awesome-vue github.com

참고 사이트 고양이도 할 수 있는 Vue.js isActive 변경하기 동적 클래스 동적 스타일 ※ 알기 쉽게 .is-active 는 배경색을 변경하게 했습니다. rintiantta.github.io 트랜지션과 애니메이션 클릭으로 카운터의 수 늘리기 클래스와 스타일 데이터 바인딩 See the Pen WNRWZeX by 배정민 (@baejm) on CodePen. SVG 데이터 바인딩하기 See the Pen BapEdYz by 배정민 (@baejm) on CodePen. 요소를 반복해서 렌더링하기 See the Pen BapEwYY by 배정민 (@baejm) on CodePen. 리스트에 요소 추가하기 See the Pen bGgJoqa by 배정민 (@baejm) on CodePen. 리스트에서 요..

참고 :codesandbox.io/s/gandanhan-gesipan-gq5mn 간단한 게시판 - CodeSandbox 간단한 게시판 by baejm using @vue/cli-plugin-babel, axios, vue codesandbox.io 상위 컴포넌트 SimplePagination.vue 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 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 TABLE PAGINATION 몇 개씩 표시: 로딩중 import axios from "axios"; import PaginatedList from "./Pagina..

vue-carousel2 vs vue-slick vs vue-swiper 뭘 사용하지? www.npmtrends.com/vue-carousel-vs-vue-slick-vs-vue-swiper vue carousel vs vue slick vs vue swiper | npm trends Compare npm package download statistics over time: vue carousel vs vue slick vs vue swiper www.npmtrends.com 그렇다면 vue-carousel 사용법은? vue-owl-carousel vue-owl-carousel VueJS wrapper for Owl Carousel www.npmjs.com :autoplay : 일정 시간마다 자동 스크롤..

위처럼 @로 절대 경로를 설정해도 style 내에선 오류만 난다.. 아래처럼 .. 으로 경로를 찾으면 동작한다. 그런데 아직 이방법이 맞는지는 정확히 모르겠다.

1. 업그레이드 npm update -g @vue/cli (안될시 vscode 에디터 껐다 켜서 다시 실행해봄) 2. 업그레이드 안될 시 재설치를 위한 vue-cli 삭제 명령어 : npm uninstall @vue-cli -g 2-1. 명령어 삭제가 안될 시 C:\Users\ [myapp] \AppData\Roaming\npm\node_modules\@vue 폴더와 C:\Users\ [myapp] \AppData\Roaming\npm\vue 폴더를 모두 삭제 3. 재설치 명령어 : npm install -g @vue/cli 4. (잘 설치되었는지) 버전 확인 명령어 : vue --version 5. vue 환경의 프로젝트 생성 프로젝트명 : vue-cli 명령어 : vue create vue-cli

App.vue 상위 컴포넌트 CheckBox.vue 하위 컴포넌트 v-model은 기본적으로 @input 이벤트 (전달) :value 값 (받을때) 으로 조절이 된다