$emit emit은 하위 컴포넌트에서 상위 컴포넌트에게 이벤트를 전달하기 위해 사용한다. * 하위 컴포넌트에서 상위 컴포넌트로 이벤트 전달 this.$emit('이벤트 명', 값); * 상위 컴포넌트에서는 하위컴포넌트에서 넘어온 이벤트와 값을 처리 v-on:'이벤트 명'="methods 명" 예) modal.vue 삭제 날짜 ParendModal.vue

Dynamic Import 정적 import를 통해 모든 스크립트를 동시에 가져온다면 로딩 시간이 길어진다. 이러한 문제점을 보완하기 위해 ES6에서 필요한 스크립트를 필요한 시점에 가져와서 사용하도록 Dynamic Import를 정의했다. () => import('./components'); 예) vue router 설정할때의 예 import SearchLayout from '@/layout/search_index.vue' const SearchRouter = { path: '/search', name: 'Search', hidden: true, redirect: '/search/searchList', component: SearchLayout, meta: { title: '통합 검색', icon: '..

export(내보내기) Javascript 내부에서 객체, 함수, 원시 값을 내보낼때 사용한다. 외부에서 import를 통해 불러온다. export 방식에는 Named와 default 방식이 있다. named export 방식 export const obo = 'obo'; export const oboArray = [1,2,3,4]; export function oboFunction() {}; export {obo, oboArray, oboFunction}; //동시에 선언 named export 방식으로 사용하면 import 하는곳에서 위에 선언된 이름을 사용해야한다. 다른이름을 사용하기 위해선 as 라는 키워드를 사용해서 변경이 가능하다. export const obo = 'obo'; export c..

Javascript Javascript는 웹페이지를 조작하는 프로그래밍 언어이다. Javascript 런타임 : 런타임이란 프로그래밍 언어가 구동되는 환경을 말한다. : Javascript 런타임은 자바스크립트가 구동되는 환경을 말한다. 예) 크롬, 파이어폭스 등 여러 브라우저들과 Nodejs 를 자바스크립트 런타임이라고 한다. Javascript 동기(Synchronous) 동기 방식은 서버에 요청을 보냈을 때 응답이 돌아와야 다음 동작을 수행한다. Javascript 비동기(Asynchronous) 비동기 방식은 요청을 보냈을 때 응답과 상관없이 다음 동작을 수행한다. 보통의 웹에선 서버에 요청을 할때 비동기 방식으로 요청을 한다. 동기 방식으로 요청을 했을경우 응답이 올때까지 브라우저는 반응이 없고..

Window.Open: Window.Open은 지정한 URL을 새로운 창 혹은 현재 창에 불러오고 해당 Window 객체를 반환한다.: Javascript "Window" 객체의 open() 함수를 사용한다. 문법window.open(url, name[, specs][, replace]);* [] 대괄호의 속성은 선택사항 url : 새로운 창에 보여질 URL 주소, 값을 비워두면 빈창(about:blank) name : 새로운 창의 속성을 지정하거나 창의 이름을 지정한다. 기본값은 "_blank"_blank : 새로운 창에 열린다. 기본값이다. _parent : window.open을 호출한 부모창에서 열린다. _self : 현재 페이지를 대체한다._top : 로드된 프레임셋을 대체한다.특정..

동적 컴포넌팅을 위해선 태그를 사용한다. comp라는 변수명을 이용해 특정 컴포넌트들을 집어넣으면 동적으로 렌더링 시킨다. 매번 특정 컴포넌트를 전환할떄는 Destory 소멸되고 새로 생성된다. 하지만 컴포넌트를 전환할 때 컴포넌트의 상태를 유지하거나 성능상의 이유로 다시 렌더링되는걸 방지해야 할때가 있다. 이때 사용하는게 이다. 태그를 태그로 감싸면 컴포넌트가 전환될때도 Destroy 소멸하지 않고 계속 남아있다. keep-alive keep-alive는 컴포넌트의 상태를 보존할때 사용한다. include 속성을 사용해 전활될때 소멸하지 않고 남길 컴포넌트를 지정할 수 있다. 아래와 같이 test1 이라는 컴포넌트는 재 렌더링이 되지 않고 캐시된 데이터를 다시 불러온다. 컴포넌트 전환 할때마다 페이지의..