vue-basic

computed : 계산된 데이터기본적으로 readonly ( getter 성질 )data : getter, settercomputed : getter메소드와 달리 computed는 객체를 리턴하기 때문에 reversedMessageComputed에 ()를 붙이지 않는

array 배열\[] v-for="값, 인덱스 in 배열" key=""object 객체{} 둘다 표현 가능하다.v-for="값, 키 in 객체" key=""

v-if는 dom구조 자체를 변경\-> dom구성을 전부 하지않음. 조건에 맞는것만 (lazy 함)\-> 즉, 초기비용이 크지 않음\-> 조건이 바뀔때 dom구조를 바꾸므로 렌더링 비용이 큼\-> 변경이 자주 일어나지 않는 곳에 적합 ( ex - 로그인 상태 여부 )v

v-bind:style 축약형 :style로 작성 가능스타일 속성중 하이픈 또는 대시로 표현된 속성(케밥)은 ''나 ""로 감싸줘서 문자로 표현하거나카멜케이스로 변경해서 사용한다ex)text-decoration 표기 예시인라인 스타일 4 처럼객체리터럴 방식으로 표현도

v-bind:class 축약문법 :class사용

변이 메소드 사용 배열대체 (새 배열로 치환) 주의사항 (배열감지 안하는 코드)

해결

영문, 숫자, 한글 까지 잘 동작 영문, 숫자, 한글 까지 잘 동작 한글은 자음과 모음이 조합해서 사용하기 때문에 한글자씩 늦게 나옴한글은 IME기능이 필요한 문자여서 그렇다IME는 간단히 말해 문자의 조합을 도와주는 SW이다Vue 공식문서에서는 IME가 필요한 언어들

연결된 메소드 한번만 실행@submit이벤트 동작은Button의 타입이 "submit"인 버튼을 누르면이벤트 버블링에 의해 동작하고,\+추가로 기본 form 동장방지 ( 새로고침, 제출 )를 위해 prevent 수식어를 달아 준다.각각 1, 2, 3, 4 별로자식, 부

또는Vue의 Instance를 확인해보면 data값은 객체로 되어있지만..객체 형태로 정의하면 모든 인스턴스가 data를 공유하기 때문에 인스턴스 끼리 다른 값을 가질 수 없다. 그래서 객체 리턴형 함수형으로 작성한다.

slot 이름에 의해서 순서가 보장된다.

filters, data, computed 를 가져와 사용가능하고이름이 같을시 자신의 것 기준으로 실행됨 ( 자신이 높은 우선순위를 갖음 )훅은 mixins가 먼저 실행됨

코드 스플리팅이란?우리가 js로 개발하게 되면, 따로 코드를 분리하지 않는 이상..하나의 파일에 모든 로직이나 코드들이 들어가있게 된다.한 두개면 상관 없겠지만 점차 규모가 커질수록 js 파일 용량도 커질 것이고,특히 SPA(싱글 페이지 어플리케이션)의 장점이 하나의

리다이렉트 및 없는 경로 처리적절한 서버 구성 없이 단일 페이지 클라이언트 측 앱이기 때문에 사용자가 http://oursite.com/user/id브라우저에서 직접 액세스하면 404 오류가 발생한다.서버에서는 해당 URL이 클라이언트에서 관리가 되기 때문에

파일 절대 경로로 설정요즘은 vue/cli로 프로젝트를 생성하면 자동으로 jsconfig.js파일도 생성해서 셋팅해준다.따로 건드릴 필요는 없음.baseUrl : 현재 에디터기준 (vscode)가 열려있는 프로젝트가 루트가 되야함paths : 별칭 설정

axios create instance 문서 : https://github.com/axios/axiosVUE CLI 2버전 때 까지는.env 파일을 소스코드에서 사용 하기 위해서webpack의 DefinePlugin같은 것들을 사용했음DefinePlugin 문

src/utils/utils.js main.js App.vue

...(생략)

기존의 문제점 : layout 구조에서 subjects : category, product, serach, wish ... 등등..appbar, view, footer를 한 곳에 정의하려면 Index.vue가 필요했음 ( 사소한 차이밖에 없는 파일이 쓸데없이 늘어남 -

vue-infinite-loading 사용.https://peachscript.github.io/vue-infinite-loading/guide/

ProductList.vue src/api/index.js src/store/index.js vue.config.js

https://github.com/surmon-china/vue-awesome-swiperhttps://v1.github.surmon.me/vue-awesome-swiper/https://github.com/surmon-china/surmon

필수, 영문, 숫자, 최대 10글자 > 필수, 공백 불가 > 필수, 이메일 형식 > 필수, 숫자 자리수 제한 >

src/plugins/TestPlugin.js main.js views/Test.vue

Node.js 의 버전을 관리하는 도구입니다.왜 관리해야 하는건가?협업을 할 때, 또는 다양한 프로젝트를 동시에 진행해야 할 때다양한 라이브러리 / 프레임워크 / 개발툴의 버전 호환 문제를 겪음컴퓨터에 다양한 버전의 Node.js 를 설치할 수 있게 함..use 커맨드

vue.config.js추가로 productionSourceMap은빌드 시에 빌드 된 dist폴더 안에 \~\~~.js.map파일이 추가되는데 이 파일을 통해 사이트 디버깅이 가능해져서 보안에 취약함. 운여에서 사용하지 않기위해 false로 둠..환경 변수로 사용도

https://tortoisesvn.net/downloads.html08\. 이제 자유롭게 집에서 작업후 private한 깃 리포지토리에 올리고 현장에서 git으로 내려 받은 후 svn에 소스를 올리면 된다~