Vue TSC & computed-refs

[louis49]

I do not understand why this have an error with transpiling with vue-tsc :

import { computed, ComputedRef, UnwrapNestedRefs } from "vue";

interface ConcreteTest {
    val: ComputedRef<string>;
}

interface Store {
    registers: ConcreteTest[];
}

class StoreManager {
    public store: UnwrapNestedRefs<Store> = {
        registers: []
    };

    addRegisters(){
        const val = computed(() => { return "0xaa" });
        this.store.registers.push({ val }); // => The expected type comes from property 'val' which is declared here on type '{ val: string; }'
    }
}

You can check it here : https://github.com/louis49/demo-vue-ts-computed-refs.git with npm build

[so1ve]

This is likely a vue core issue

[teleskop150750]

Попробуй убрать UnwrapNestedRefs. Или { val: val.value}

[davidmatter]

Hey there, as there have been many fixes in the last 2.x versions: Please let us know if you're still encountering this issue. Otherwise kindly close this one, thanks!

[kermanx]

This is expected. As said in https://github.com/vuejs/language-tools/issues/4350#issuecomment-2109275407, you can use { val: val.value }, or remove UnwrapNestedRefs. In real-world cases, you may need to use shallowRef instead of ref