import/export 사용법 1.export deafult 변수명 export defatult 변수명; ##파일 내 한 변수 혹은 데이터 그대로 export {변수명1,변수명2}; ##여러 변수들의 export 2.import 변수명 from 상기 import 파일 경로 import 변수1 from ''; default 변수를 불러올 때 import {변수1} from ''; export {}변수들 중에서 불러올 때

0.UI에 대한 디자인을 미리 작성 상세내역 상세페이지 내용 닫기 ## template 내 html정보 작성 body { margin:0 } div { box-sizing: border-box; } .black-bg{ width: 100%; height: 100%; background: rgba(0,0,0,0.5); position: fixed; padding: 20px; } .white-bg{ width: 100%; background:white; border-radius: 8px; padding: 20px; } ## style 내 css정보 작성 1.UI 상태(state)를 데이터로 저장 (0/1 or true/false) data() { return{ ## ## pop_state: false, } ..

이벤트 핸들러 HTML 클릭 시 코드 실행 JS 제공기능 HTML 속성에 onClick="" 추가 클릭->다루는 데이터를 찾아서 처리(e.g 1증가)->처리된 내용을 html에 반영 Vue 문 HTML 속성에 v-on:click="" or @click="" 추가 클릭->관련된 데이터만 처리 (->자동 리랜더링) 허위매물신고 신고 수: {{ 신고수 }} ## 함수내용 직접 입력 허위매물신고 신고 수: {{ 신고수 }} ## scripts 내에 작성한 함수명으로 처리 methods : { increase() { this.신고수+= 1; } }

Vue의 html 반복문을 통해 여러 태그를 생성가능 횟수를 지정하거나 array,object를 넣어 자료안의 데이터수만큼 반복생성 리스트 요소를 반복 시마다 받아와 내용에 적용 가능 반복요소는 2개까지 적용가능 내용 {{ i }} {{ 작명 }} "

사용목적 - 자주 변경되는 데이터의 자동랜더링을 통한 교체, 하드코딩 방지 등 에서 상기 data의 키값을 불러와 데이터바인딩 내용: {{키값}} 형태로 작성 {{ price1 }} 만원 HTML 속성: :속성="데이터 키값" xx 원룸

1.node 설치 2.npm 확인 3.vue 설치 4.vue cli 설치 5.프로젝트 생성 6.기타 에러 시 1.node 설치 https://nodejs.org/en Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org node 버전확인:node -v 2. npm 설치버전 확인 Node 설치 시 자동설치완료 설치된 npm 버전확인:npm -v 3.vue 설치 npm install vue npm update vue 4.vue cli 설치 npm install -g @vue/cli npm update -g @vue/cli 5.vue 프로젝트 생성 프로젝트 경로로 이동 vue create 커맨드라인에..