Question

我正在安装一个无线电组列表，所以当列表中的所有组都进行了无线电检查时，我会分派该列表，但是当我收到POST响应时，如果查看浏览器，所有无线电都不会被检查控制台上有每个无线电的值，问题就在于没有呈现检查值。

但是，当我再次单击以检查无线电时，出现了新的混乱，但是现在该实体已经存在，并且在PUT响应下一切正常，无线电仍然呈现为选中状态。

这是我的做法：

<template>
    <v-radio-group v-model="grade.rating" @change="onChange">
        <v-radio v-for="r in ratings" :key="r.id" :value="r" :label="r.initials" :hint="r.name" color="indigo" />
    </v-radio-group>
</template>

methods: {
    onChange() {
        const pendingGrades = this.grade.abilities.filter(a => a.rating === null)
        if (pendingGrades.length === 0) {
            this.$store.dispatch('grade/save', this.grade)
                .then(grade => {
                    if (!this.grade.id) {
                        this.grade = { 
                            ...grade, 
                            abilities: grade.ability.map(a => ({ ...a })) 
                        }
                    }
                })
        }
    }

grade是父组件传递给该组件的对象，我在其中将该列表与无线电组一起安装。

这是成绩对象的示例：

{"id":285992,
    "abilities":[
            {"id":1323220,
             "ability":{
                 "id":652,
                 "name":"Here is the name",
                 "rating":{
                     "id":1,
                     "name":"The name",
                     "initials":"TN"
]}

先谢谢了！

POST响应（使用Vuetify Component v-radio）后，单选按钮失去其检查状态

0 个答案: