➕LEVELUP(Vue3)
1.[Vue3]plugins 설정 ( app.config.globalProperties )
app.config.globalProperties는 전역 애플리케이션 인스턴스에 속성 추가 할 수 있는 기능이다. pulgins폴더안에 person.js라는 파일를 만들어주고아래 예시 코드를 작성한다. 그리고 main.js에 가서 app전역으로 해당 속성을 사용하겠다고
2.[Vue3] pulgins설정(app.component)
내가 만든 컴포넌트 매번 import해서 쓰기 귀찮을 때 요긴하게 쓰일 방법! pulgins폴더 안에 global-components.js 파일pulgins폴더 안에 global-components.js파일을 만들어준다. 전역으로 등록하고 싶은 컴포넌트를 가져와서 아래
3.[Vue3]Composable이란?
composable은 vue의 compositionAPI를 활용하여1\. 상태 저장 비지니스 로직을 캡슐화2\. 재사용하는 기능흠 정리하면서도 어렵긴 한데 composable은 상태 저장 로직을 사용하면서 변경되는 상태 관리가 포함된다고 한다. src폴더 하위에 com
4.[Vue3] Pinia 사용법
pinia를 설치해주고,main.js파일에 아래와 같이 코드를 작성해준다.pinia를 사용하기 위해서는 store를 정의해야한다.src 폴더 아래에 stores라는 폴더를 만들고 그 안에 사용할 store파일 만들어준다. (ex:counter.js)파일안에 아래처럼 코
5.[Vue3] onMounted , querySelectorAll 반환값 빈배열 이거 뭐지?
for문으로 반복되고 있는 div태그에 class로 lazy값을 넣어줬다. 그리고 Dom이 그려진 후인 onMounted에서 document.querySelectorAll('.lazy')로 해당 태그들을 가져오려고 했는데, 반환 값이 빈 배열로 나온다. ( 아래처럼 나
6.[Vue3] Custom Directives 적용하기
진행하고 있는 프로젝트에 ImagelazyLoading을 적용시키면서 해당 기능을 directive로 만들어 봤다. v-if, v-for와 같은 나만의 디렉티브를 만들 수 있는 기능이다. 참고: https://vuejs.org/guide/reusability