toRefs와 함께 스크립트 설정 및 반응 상태 vue 3 사용

Question

vue 프로젝트에서 스크립트 설정을 사용하려고 합니다.

스크립트 설정을 사용하기 전의 스크립트는 다음과 같습니다.

Answer 1

스크립트 설정에서 직접 state 반응 값에 액세스하려면 다음과 같이 객체 구조 분해를 사용할 수 있습니다.

으아악

그런 다음 템플릿에서 직접 값에 액세스할 수 있습니다

으아악

단, 속성을 모두 다시 입력해야 하니 불편하네요

Answer 2

脚本设置변수 정의의 암시적 번역

으아악

to

으아악

脚本设置中的return {...dynamicValue}是不可替代的，它仅适用于常见用例。这需要将其与脚本의 return {...dynamicValue}는 교체할 수 없으며 일반적인 사용 사례에만 적합합니다. 이를 위해서는 스크립트와 결합해야 합니다.

return {...toRefs(state)} 没有什么好处，因为脚本块中不使用生成的引用。即使它们是，它们通常也被定义为单独的反应值而不是 state 대상:

으아악

이러한 값을 단일 객체로 처리해야 하는 경우 다음과 같이 결합할 수 있습니다.

으아악

스크립트 및 脚本和脚本设置에도 동일한 방식으로 작동합니다.