Vue 3

Vue.js study- 라우터의 기본 공부하기

한동안 하고 싶은 기획 공부를 하느라 개발 공부가 미루어졌다. 오늘 이어서 vue와 라우터에 대한 공부를 할 예정. 현재 듣고 있는 수업 1월 내에 꼭 완강을 해야지 생각이 들었다. 이번 강의에서는 뷰 라우터에 대해서 배우게 되었다. Vue router의 공식 홈페이지 >> 설치 | Vue Router 설치 직접 다운로드 / CDN https://unpkg.com/vue-router/dist/vue-router.js (opens new window) Unpkg.com (opens new window)은 NPM 기반 CDN 링크를 제공합니다. 위의 링크는 항상 NPM의 최신 릴리스를 가리킵니다. https://unpkg. router.vuejs.org Vue.js study- 라우터의 기본 공부하기 202..

괴발개발 2022.01.03

Vue.js 컴포넌트 통신 방식과 event

1.Vue 인스턴스에 app-content 콤포넌트 정의해주기 -#app 아이디에서, -app-content 콤포넌트 -가지고 있는 data는 숫자로 10 new Vue({ el: '#app', components:{ 'app-content':appContent }, data: { num: 10 } }) 2.appContent 함수 정의해주기 -props안에 propsdata라 정의 (*여기서 실수함, 프롭스의 데이터 값이니까 그대로 propsdata라고 써주고, 나중에 v-bind에서 정확히 propsdata들 중에서(여러개라면) 어떤걸 사용할지 정의해줄수 있음) -{{}}로, propsdata값 그대로 보여주기 var appContent = { template: '{{propsdata}}', prop..

괴발개발 2021.08.18

Vue.js instance study- 뷰 전역 콤포넌트와 지역 콤포넌트

디자인에서도 콤포넌트의 개념을 사용하는데 vue에서도 콤포넌트의 단위를 사용한다. 예전에 html을 배울때 여러 페이지 생성시 js로 헤더와 푸터를 붙이는 작업을 했는데 vue에서도 가능했다. Vue.js instance study- 뷰 전역 콤포넌트와 지역 콤포넌트 2021/08/08 [뷰 컴포넌트] 화면의 영역을 구분하여 개발하고, 콤포넌트 안에 콤포넌트를 넣을 수 있다. 콤포넌트를 사용하여 제작하면 재사용(코드의 반족을 최소화) 할 수 있고, 빠르게 화면을 만들 수 있음. 1.새롭게 app이라는 div 정의 2.script를 두개 생성 a.vue 스크립트 b.new Vue 스크립트 3.new Vue 스크립트 안에 엘레멘트인 el을 적고 tag가 app인 div를 선택, 4.open live serv..

괴발개발 2021.08.08