웹(web)/프론트엔드-vue25 vue2.0 이해를 위한 추천 사이트 vue2.0 공식 문서에서 이해가 더 필요한 것들이 생겼을 때 읽어보면 좋을 사이트 추천 특히 2.0 공식 문서의 lifecycle hook은 이해가 조금 어려워서 추가적으로 읽어보면 이해에 도움이 될 것이다. 1. learnvue lifecycle hook과 computed 등 디테일한 설명이 들어있어서 좋다. learnvue.co/2019/12/a-beginners-guide-to-vuejs-lifecycle-hooks/ A Beginner’s Guide To VueJS Lifecycle Hooks – LearnVue VueJS Lifecycle Hooks seem like a pretty easy concept, and they are! But making sure you’re putting cod.. 2020. 11. 15. webpack: 이 시스템에서 스크립트를 실행할 수 없으므로 ... vs code에서 webpack을 설치하고 사용하려고 터미널에서 입력하면 아래와 같은 오류가 나올 수 있다. 또는 'webpack' 용어가 cmdlet, 함수, 스크립트 파일 ... 이라는 오류가 나올 수도 있다. 이는 현재 사용 중인 terminal 설정이 안되어 있어서 그렇다. 해결 방법은 간단하다. 1. 터미널에서 해당 부분을 클릭해서 powershell로 되있는 것을 cmd로 변경한다. 2. 해결 끝 터미널 종류를 변경하는 다른 방법은 다음과 같다. ctrl + shift + p (command palette) 열어서 terminal: Select Default Shell 입력 추천 항목 중 Command Prompt 또는 Git Bash 선택 변경 후 Terminal 닫았다가 새로 Termina.. 2020. 7. 10. component slot Vue component를 만들 때 내부에 텍스트 들을 template에 반영하려면 어떻게 하는지 알아보자. 새로운 뷰 컴포넌트가 my-comp라고 하자 Hello Vue.component('my-comp', { template: ' ' } 와 같은 방식으로 작성하면 Hello가 반영되지 않는다. 반영하게 하려면 어떻게 해야할까? template: ' ' 으로 작성하면 된다. 부분이 Hello로 바뀌는 것을 확인할 수 있다. 컴포넌트 내용으로 넣을 때 slot의 이름을 지정하는 것도 가능하다. 이러면 Vue의 template에서 원하는 위치에 해당 요소를 위치시킬 수 있다. 다음과 같다. input이 slot1으로 지정되어 실제 화면에서 뒤쪽으로 위치가 변경되었다. html에서 Vue의 data에서 가져.. 2020. 7. 9. component props, emit 와 같은 구조로 작성하고 app에 Vue 인스턴스르 붙이면 컴포넌트간의 구조는 어떻게 될까? 여기선 app에 붙인 컴포넌트가 my-comp보다 상위 컴포넌트가 된다. 따라서, app에 붙은 컴포넌트를 vm이라고 하면 vm은 my-comp에게 props를 통해 데이터를 전달할 수 있다. 반대로 my-comp는 vm에게 데이터를 어떻게 전달할까? 답은 emit을 사용해서 전달한다. 데이터를 전달하는 것은 아니고 이벤트를 전달하게 된다. 아래 코드의 구조를 보면 my-comp를 만들 때 my-msg props에 vm의 message 값을 넘겨주기 위해서 :my-msg="message"를 사용했다. 반대로 my-comp에서 클릭을 발생했을 때 이벤트를 vm으로 넘겨주기 위해서 my-comp methods에 up.. 2020. 7. 9. 이전 1 2 3 4 ··· 7 다음
