목록웹프로그래밍/vuejs (2)
bdfgdfg
$refs refs문법을 이용해 Dom에 직접 접근할 수 있다. 사실상 document.querySelector로 해당 Dom 요소를 가져와 접근하는것과 동일하다. -> 또한 HTML 태그뿐만 아닌, 템플릿에 컴포넌트 태그에도 ref 속성을 정의해서 해당 컴포넌트에 접근할 수 있다(내부 data등 접근가능) -> 사실 vue를 쓴다면 태그에 binding된 데이터에 접근하면 되기에 그럴일은 거의 없겠지만은 ref버튼 상위 컴포넌트의 코드. 하위 컴포넌트인 HelloWorld를 자식으로 두고있고, HelloWorld컴포넌트(자식)의 내부 요소에 접근하기 위해 ref버튼을 만들었음. {{myData}} 버튼 하위 컴포넌트의 코드 button의 ref는 상위 컴포넌트에서 ref의 이름을 통해 접근하기 위해서 ..
Vue/cli 구조 모든 Vue(확장자)는 싱글파일컴포넌트로 template, script, style 태그들의 구조를 가지고 있다. -> 싱글파일컴포넌트란 Vue의 특징인 컴포넌트를 하나의 파일에서 작성하는것을 의미하며 template, script, style의 구조를 가지고, 화면의 특정 영역에 대한 HTML,CSS,JS 코드를 관리하는 곳이라고 보면 된다. template -> 해당 vue 컴포넌트를 구성하는 HTML 태그와 Vue의 문법이 들어감 script -> js코드를 작성할 수 있고, 주로 해당 뷰 컴포넌트의 속성을 정의하는 곳 style -> template에 들어가는 HTML 태그들의 css 요소를 정의. scope라는 속성을 이용해 해당 뷰 컴포넌트에만 css 적용이 가능하게끔 할 ..