JS 프레임워크/Vue6 [Vue] Vue 라우트 라우팅은 현대 웹 앱 형태 중 하나인 싱글 페이지 애플리케이션에서 주로 사용하고 있습니다 브라우저에서 웹페이지를 요청하면 서버에서 응답을 받아 웹페이지를 다시 사용자에게 보여주는 준비를 하는 시간동안 깜박이는데 라우팅으로 처리하면 깜빡거림 없이 화면을 전환할 수 있을뿐 아니라 더 빠르게 화면을 조작할 수 있음 태그 설명 페이지 이동 태그, 화면에서는 로 표시되며 클릭하면 to에 지정한 url로 이동합니다 페이지 표시 태그, 변경되는 url에 따라 해당 컴포넌트를 뿌려주는 영역입니다 뷰 라우터 예제 Main 컴포넌트로 이동 Login 컴포넌트로 이동 2021. 4. 6. 뷰 컴포넌트 통신 컴포넌트 간 통신과 유효 범위 뷰의 경우 컴포넌트로 화면을 구성하므로 같은 웹 페이지라도 데이터를 공유할 수 없다. 컴포넌트 자체적으로 고유한 유효 범위를 갖기 때문이다. 이는 뷰 프레임워크 내부적으로 정의된 특징이다. 각 컴포넌트의 유효 범위가 독립적이기 때문이다. 컴포넌트 유효 범위 증명 코드 상 하위 컴포넌트 관계 기본적인 데이터 전달 방법은 상하위 컴포넌트 간의 데이터 전달 방법이다. 상위-하위 컴포넌트란 트리 구조에서 부모 노드, 자식 노드처럼 컴포넌트 간의 관계가 부모.자식으로 이루어진 컴포넌트를 의미한다. 상위에서 하위 컴포넌트로 데이터 전달하기 props속성 props는 상위 컴포넌트에서 하위 컴포넌트로 데이터를 전달할 때 사용하는 속성이다. 상위 컴포넌트의 HTML코드에 등록된 child.. 2021. 4. 1. 뷰 컴포넌트 컴포넌트란? 컴포넌트란 조합하여 화면을 구성할 수 있는 블럭을 의미. 컴포넌트를 활용하면 화면을 빠르게 구조화하여 일괄적인 패턴으로 개발 할 수 있다. 컴포넌트 등록 지역(local)컴포넌트는 특정 인스턴스에서만 유효한 범위를 갖고 전역(Global)컴포넌트는 여러 인스턴스에서 공통으로 사용 전역 컴포넌트 등록 코드 컴포넌트 등록 인스턴스가 생성되고, 인스턴스 내용이 화면요소로 변환될 때 컴포넌트 태그도 함께 변화된다. 컴포넌트 태그에 정의한 컴포넌트 내용은 사용자가 사용자가 볼 수 있는 형태의 화면요소로 최종 변환. 전역 컴포넌트를 등록하려면 HTML에서 사용할 태그 이름을 컴포넌트 이름으로 작성하고, 중괄호{}안에는 HTML태그가 실제로 화면에서 그려질 때 표시될 내용을 작성해야 한다. 전역 컴포넌트.. 2021. 3. 31. Vue 인스턴스 뷰 인스턴스의 정의와 속성 뷰 인스턴스(Instance)는 뷰로 화면을 개발하기 위해 필수적으로 생성 해야 하는 기본 단위. 뷰 인스턴스 생성 뷰 인스턴스 생성 new Vue()로 인스턴스를 생성할 때 Vue를 생성자라고 한다. Vue생성자는 뷰 라이브러리를 로딩하고 나면 접근할 수 있다. 생성자는 객체를 새로 생성할 때 자주 사용하는 옵션과 기능들을 미리 특정객체에 저장해 놓고 새로 객체를 생성할 때 기존에 포함된 기능과 더불어 기존 기능을 쉽게 확장하여 사용하는 기법 뷰 인스턴스 생성 인스턴스를 생성할 때 재정의할 data, el, template등의 속성을 의미 el 속성 역시 미리 정의 되어 있으며 뷰로 만든 화면이 그려지는 시작점을 의미 뷰 인스턴스로 화면을 렌더링할 때 화면이 그려질 위치의 돔.. 2021. 3. 31. 이전 1 2 다음
