Vue 에서 computed 관련 질문 드립니다.

Question

안녕하세요.현재 vue3 을 통해 프론트엔드 개발중인 FE 개발자 입니다.다름이 아니라 이번에 vue를 처음 써보는데, computed를 쓰면서 인자를 쓸 수 없다 는 규칙이 있다는 것을 알고 나서함수를 리턴하는 방식으로 쓰면 인자를 쓸수는 있다는 것을 알았습니다. 하지만, 이렇게쓰면 computed의 기능 중 하나인캐싱을 할 수 있다(메모이제이션)는 장점을 쓸 수 없는게 아닌가하여 질문 드립니다. 이런식으로 computed가 함수를 리턴하는 식으로 쓰면인자를 쓸 수 있는걸로 아는데 이래도 메모이제이션 이점을 가져갈 수 있는건가요 ??const tagName &#61; computed(() &#61;> ({ model, name }) &#61;> name[locale.value] &#43; ((model) ? &#96; : ${model.list[model.selected].key}&#96; : ''));const tagActive &#61; computed(() &#61;> (column) &#61;> column?.image?.resized || (column?.image?.ipaImage?.resized && column?.image?.ipaImage2?.resized));

Clickin · Answer

그런 식으로 사용하는 경우 그냥 함수 자체를 쓰는 게 낫습니다.computed의 이점은 가독성박에 없습니다.https://vuejs.org/guide/essentials/computed#computed-caching-vs-methodshttps://stackoverflow.com/questions/40522634/can-i-pass-parameters-in-computed-properties-in-vue-js

Hide_D · Answer

저라면 순서를 반전시켜서 원본 소스에다가 watch를 써서 값을 바꾸겠습니다...computed를 저렇게 쓰는건 좀 아닌것 같네요.const tagName &#61; ref(''); const tagActive &#61; ref(false); watch([model name], ([newModel, newName]) &#61;> { tagName.value &#61; newName[locale.value] &#43; ((newModel) ? &#96; : ${newModel.list[newModel.selected].key}&#96; : '') });

Vue 에서 computed 관련 질문 드립니다.

2개의 답변

Q&A 목록