목록뷰 (3)

송민준의 개발노트

Vue - EventBus 정리

EventBus란? Vue는 컴포넌트 단위로 메소드/변수를 포함해서 구성한다. Vue에서 개발을 하다보면 데이터의 경우 vuex와 같은 라이브러리를 사용하면 컴포넌트간 데이터를 쉽게 가져올 수 있다. 그리고 컴포넌트간 메서드를 호출해야할 경우가 있다. 보통 emit 같은 기능을 사용해서 구현을 하겠지만 비 부모-자식간 통신을 해야하면 어떻게 해야 할까? 이러한 경우 EventBus를 활용하여 컴포넌트간 메소드를 호출할 수 있다. EventBus라는 공간에 각 프로젝트에 맞는 규격을 만들어 규격에 따라 EventBus를 활용하면 된다. 구성하는 코드는 별도로 빼든 main.js에 선언하든 크게 상관은 없다. 기본적인 구성은 아래와 같다. //main.js import Vue from 'vue' import..
웹/Vue 2021. 7. 15. 02:37
Vue 토이프로젝트 github에 올리기(Atom, git bash 사용)

우선 Git이 설치되어 있어야 한다. 이래저래 만지다 보니 커밋된거 같은데;; 1. 일단 아톰에서 local repository를 만든다. 만들면 아래 오른쪽 처럼 staged 상태창에서 깃허브에 올릴걸 설정한다. 2. 올릴거 정하고 커밋하면 로컬저장소에 있는게 커밋됨 3. cmd 키고 프로젝트 경로로 간다.(난 vuejs) 4. 깃헙에서 레퍼지토리를 하나 만든다.(이름은 Vue_Toy_Atom 으로 만들었음) 5. 아래처럼 명령어 치면 된다. 6. 확인하면 잘 올라가 있다. 맨날 이클립스나 인텔리제이, 소스트리 같은 GUI 툴을 사용해서 업로드 했는데 이번엔 첨으로 bash를 써봤다. 꽤나 간편한뎅...?
웹/Vue 2020. 2. 14. 01:05
뷰 라우터

npm i vue-router --save 라우팅? 웹 페이지 간의 이동 방법. 현대 웹 앱 형태 중 하나인 싱글 페이지 어플리케이션에서 주로 사용 더보기 싱글 페이지 어플리케이션 페이지를 이동할 때마다 서버에 웹 페이지를 요청하여 새로 갱신하는 것이 아닌 미리 받아 놓고 페이지 이동 시 라우팅을 이용하여 화면을 갱신하는 패턴을 적용한 어플리케이션 뷰 라우터 뷰 라우터는 뷰에서 라우팅 기능을 구현할 수 있도록 지원하는 공식 라이브러리이다. 태그는 다음과 같음 페이지 이동 태그. 로 표시됨. 클릭하면 URL로 이동 페이지 표시 태그. 변경되는 URL에 따라 해당 컴포넌트를 뿌려주는 영역 뷰 라우터 예제 Main 컴포넌트로 이동 Login 컴포넌트로 이동 * mount API el 속성과 동일하게 인스턴스를..
웹/Vue 2020. 2. 2. 20:11
이전 Prev 1 Next 다음