Develop Note by J.S.

Methods로 변화가 적고 간단한 계산식을 구현 할 경우 상태가 변하지 않더라도 매번 연산작업이 수행되어 효율성이 떨어지는 상황에 대체할 수 있는 기능으로 Computed를 사용합니다. 만약 이전 계산식에서 Observing하고있는 상태값이 변하지 않을 경우 재연산 하지 않고 cache data를 그대로 사용하여 효율적으로 결과값을 가져올 수 있습니다. 책을 가지고 있다: {{ publishedBooksMessage }} 참조 : https://v3-docs.vuejs-korea.org/guide/essentials/computed.html

1. LifeCycle Hook 상기 이미지는 vue의 LifeCycle입니다. 기존의 Vue2에서 사용했던 LifeCylcle Hook의 사용법 또한 약간 차이점이 있습니다. 앞선 게시글에서 말씀드렸듯이, created대신 setup함수로 대체되었다는 부분 외에는 거의 비슷하지만 호출 방식의 경우 setup 함수 내에서는 composition api 방식으로 호출 할 수 도 있고, setup함수 외부에서는 기존의 option api 방식으로 LifeCycle Hook을 사용할 수 있습니다. import { onMounted, ref, reative } from 'vue' export default { setup() { const _ref = ref(3); const _reactive = reactive..

Vue3 에서 타입지정 할 때 Vue3의 타입스크립트가 익숙치 않은 경우 타입지정이 까다롭습니다. 주로 사용하는 기능에 대한 타입 지정 방법입니다. 1. ref import { ref } from 'vue' import type { Ref } from 'vue' // 변수에 직접 type을 지정하는 case const year: Ref = ref('2020') year.value = 2020 // ok! // or //ref 함수 호출 시 제네릭으로 타입을 지정하는 case const year = ref('2020') year.value = 2020 // ok! 2. reactive import { reactive } from 'vue' interface Book { title: string year?:..