본문 바로가기

vue3

[Vue3 & typescript] component의 composables/ts 로 emit과 props 보내기
이슈 pc와 mo 버전에서 공통적인 부분은 함께쓰기 위해 composables에 ts를 따로 빼서 관리하는데, 빼는 과정에서 emit과 props가 잘 옮겨지지 않았다. vue파일경로: src/views/fb-depth-select.vue ts파일경로: src/composables/fb-depth-select.ts ts 파일 따로 빼기 전 vue 소스 src/views/fb-depth-select.vue 부모 컴포넌트로 보낼 emit을 만들고 (emit 사용하는 부분은 생략) 부모에서 받을 props를 따로 선언하였다. 파일분리 시도 (실패케이스) 1. vue 소스 > src/views/fb-depth-select.vue composables/fb-depth-select.ts 로 소스를 옮기고 fb-de..
[Vue2 vs Vue3] vue에 있는 ref 접근하기 ! this.$ref 사용하기 (template refs)
Vue2 vue2에서는 this.$refs로 가져온다. Vue3 vue3에서는 ref(null)을 선언하는데, 여기서 변수명은 꼭 위에 템플릿에서 사용하는 ref 이름과 동일하게 지정해야한다. ref는 mounted 전에는 없을 수 있으니 선언은 위에서 하되 mounted에서 value값을 담는다.
[Vue2 vs Vue3] 기본내용정리1 (Fragment / setup / ref,reactive)
Vue2 vs Vue3 1. Fragment vue3에서는 template 태그 안에 꼭 하나의 태그로 감싸지 않아도 된다. 2. setup() 이 안에서 변수, 함수 선언 ! 사용할 것은 return 시키기 this는 더이상 사용하지 않는다. 3. ref와 reactive 변하는 데이터는 그냥 선언하면 안되고 ref로 감싸서 선언하기 기본 자료형(숫자, 문자 등)이면 ref로 감싸고 객체나 배열이면 reactive로 감싸기 1. Fragment Vue3에서는 template 태그 안에 꼭 하나의 태그로 감싸지 않아도 된다 logo hello world logo hello world 2. setup() 이 안에서 변수, 함수 선언 ! 사용할 것은 return 시키기. this는 더이상 사용하지 않는다. ..