bounty将在2天后过期。回答此问题可获得+50的声望奖励。Mike3355正在寻找规范答案。

我有一个简单的Hello World应用程序，我正在尝试解析一个 typescript 对象。在我完成Vue 2类组件之前，我确信问题是过渡到VUE只是不熟悉。
以下方法的问题就在这里

if (response != null) {
                state.name = JSON.parse(response.getName())
                state.age = parseInt(JSON.parse(response.getAge()))
            }

控制台出错

Error while getting the response: TypeError: response.getName is not a function

家庭课

<script lang="ts">
import {api} from "@/lib/api";
import {reactive} from "vue";

export default {
    name: "Home",
    setup() {
        const state = reactive({
            name: '',
            age: '',
            mode: process.env.NODE_ENV,
            myName: process.env.VUE_APP_TITLE
        })

        const submit = async () => {
            try {
                const response = await api.getTest()
                if (response != null) {
                    state.name = JSON.parse(response.getName())
                    state.age = parseInt(JSON.parse(response.getAge()))
                }
            } catch (error) {
                console.log('Error while getting the response:', error)
            }
        }

        return {
            ...state,
            submit
        }
    },

}
</script>

api.ts

export const api = {

    async getTest() {
        try{
            return await grpcClient.get<TestResponse>("/v1/test")
                .then(res => {
                    return res.data <-- json but would be nice if it was a TS object
                })
        }catch (err) {
            console.log("error" + err);
        }
    },

}

控制台中的错误：

Error while getting the response: TypeError: response.getName is not a function
    at eval (Home.vue?4912:19:1)

但即使我用了

state.name = JSON.parse(response).name

访问对象时遇到问题
我的假设是Vue3有更好的Typescript支持，这就是类组件是deprecated的原因。
我怎样才能让我的gRPC typescripts对象与我的vue组件集成？