전체 글80 [인프런] axios https://joshua1988.github.io/vue-camp/vue/axios.html#%EC%95%A1%EC%8B%9C%EC%98%A4%EC%8A%A4-%EC%84%A4%EC%B9%98 Axios | Cracking Vue.js 액시오스 뷰에서 권고하는 HTTP 통신 라이브러리는 액시오스(Axios)입니다. Promise 기반의 HTTP 통신 라이브러리이며 상대적으로 다른 HTTP 통신 라이브러리들에 비해 문서화가 잘되어 있고 API가 다양합니다. 액시오스 설치 프로젝트에 액시오스를 설치하는 방법은 CDN 방식과 NPM 방식 2가지가 있습니다. CDN 방식 NPM 방식 액시오스 사용방법 라이브러리를 설치하고 나면 axios라는 변수에 접근할 수 있게 됩니다. axios 변수를 이 joshua19.. 2019. 8. 28. [인프런] 뷰 라우터 https://router.vuejs.org/installation.html Installation | Vue Router Installation Direct Download / CDN https://unpkg.com/vue-router/dist/vue-router.js Unpkg.com provides npm-based CDN links. The above link will always point to the latest release on npm. You can also use a specific version/tag via URLs like https://unpkg.co router.vuejs.org https://joshua1988.github.io/vue-camp/vue/router.html R.. 2019. 8. 28. [인프런] 같은 컴포넌트 레벨 간의 통신방법 같은 컴포넌트 : 같은 컨포넌트 레벨에 존재하는 컴포넌트 ex) AppContent 컴포넌트 에서 AppHeader컴포넌트같의 통신방법 => 10이란 데이터를 넘겨줄거임 우선작성 : 같은 레벨의 컴포넌트 등록 1. AppContent에 버튼을 추가 pass란 버튼을 클릭하면 AppHeader로 데이터가 넘어가게 할거임 2. pass버튼 클릭시 클릭이벤트를 부여하여 이벤트를 발생시킴 10 이라는 인자를 넣어 이벤트를 발생시킴 pass라는 버튼 클릭시 payload 에 10이라는 인자가 들어가있음 이렇게 하는 이유는 AppContent에서 AppHeader 로 바로 데이터를 전달하면 좋겟지만 둘이 통하는 길은 막혀있다. ==> 같은 레벨간의 바로 데이터 전달은 불가능하다 그렇기 때문에 상위 컴포넌트에 값을 .. 2019. 8. 27. [인프런] 뷰 인스턴스에서의 this 뷰 객체안에 메서드나 데이터 들은 this로 불러올 수 있다. this 는 뷰에 들어있는 객체를 뜻함 https://www.w3schools.com/js/js_this.asp JavaScript this The JavaScript this Keyword Example var person = { firstName: "John", lastName : "Doe", id : 5566, fullName : function() { return this.firstName + " " + this.lastName; } }; Try it Yourself » What is this? The JavaScript this keyword ref www.w3schools.com https://medium.com/quick-code.. 2019. 8. 27. [인프런] 컨포넌트간 통신방법 [props] 위와같은 컨포넌트 구조가 있다. 위와같은 상황에서 AppHeader 에서 LoginForm으로 데이터를 전달했다. LoginForm은 전달받은 데이터를 AppFooter로 데이터를 보냈고 AppFooter는 NavigationBar 로 데이터를 보냈다. 라고 하면은 특정 컨포넌트의 변화에 따라 나머지 컨포넌트들이 유기적으로 데이터가 변화하는것을 볼 수 있다. ==> 이런 데이터들의 관계가 생기기 시작하면 특정 데이터가 변화했을때 그로인한 버그를 추적하기 힘들다 (n방향 통신의 문제점) 기존 MVC패턴이 이런 문제점이 있었다. - 뷰에서의 컨포넌트 통신 규칙 이제는 데이터가 아래로만 흘러간다 => 컨포넌트 통신의 규칙이 생김 ==> 데이터의 흐름을 추적할 수 있다. 아래에서 위로는 이벤트가 올라간다. 위에.. 2019. 8. 27. [인프런] 뷰 컴포넌트 뷰의 특징 중 하나 컴포넌트 ※ 요즘 대부분의 모던 프런트엔드 프래임워크들은 컴포넌트 기반으로 개발이 되고 있다. - 컴포넌트 화면의 영역을 영역별로 구분하여 관리. 컴포넌트 기반으로 화면을 개발하게 되면 코드의 재사용성이 올라가고 빠르게 화면을 제작할 수 있습니다. 영역을 구분했을 때 컴포넌트 간의 관계가 생긴다. - 컨포넌트 등록 기본적인 인스턴스를 생성하면은 root 컨포넌트가 된다. 전역 컨포넌트 컨포넌트 등록 Vue.component('컴포넌트 이름', 컴포넌트 내용); 컨포넌트 등록 후 template 속성을 이용하여 태그를 등록 등록된 컴포넌트 사용시 일반 태그와 같은 형식으로 사용하면 된다. 등록된 컴포넌트를 사용하면 화면에 컨포넌트 내용이 화면에 뿌려질것임. 지역 컴포넌트 (주로사용) 생.. 2019. 8. 27. 이전 1 2 3 4 5 ··· 14 다음
