Vuejs 구성 API의 Ref() 유형 오류를 해결하는 방법

Vuejs 구성 API의 Ref() 유형 오류를 해결하는 방법

vue composition API를 사용하고 있으며 각 객체에 값 속성이 있는 객체의 배열에 대해 ref를 사용하고 있습니다.각 배열의 속성 값과 typescript가 ref의 값을 혼동하고 있는 것 같습니다.

위 그림과 같이 ar의 종류를 알려주는 typescript는 이름과 값을 포함한 오브젝트 배열이지만 ref를 사용하면 잘못된 type이 검출됩니다.아래와 같은 변환으로 사용해도 문제가 해결되지 않습니다.

const arr2 = ref(arr as { name: string; value: number }[]);

그러나 값 속성을 값 2 또는 다른 값으로 변경하면 다음과 같이 작동합니다.

업데이트:

여기 내가 오늘 직면한 또 다른 문제가 있다.

이 타입의 에러는 어떻게 해결해야 할까요?

이미지를 사용하여 코드를 표시하다니 유감입니다.왜냐하면 다시 입력해야 합니다.

예, 개체에서 '값'을 키로 사용하면 Typescript가 혼동되는 것은 분명합니다.인터페이스를 선언하는 것으로, arr2 를 선언하기 위해서도 사용할 수 있습니다.

    interface thing {
        name: string,
        value: number
    };

    const arr: thing[] = [
        {name: "x1", value: 1},
        {name: "x2", value: 2}
    ];

    const arr2: Ref<thing[]> = ref(arr);

    arr2.value.forEach(item => console.log(item.name + ':' + item.value));

그러나 이 문제를 해결하는 가장 좋은 방법은 객체에서 '가치'를 키로 사용하지 않는 것입니다.

언급URL : https://stackoverflow.com/questions/61052876/how-to-solve-vuejs-composition-apis-ref-type-error