默认情况下未选中Vue.js单选按钮

我想对

v-for

循环中的单选按钮进行默认选中。 代码如下：

  <ul v-for="p in photos">
        <li>
          <div>

          <div>
            <div>
              Visibility: {{p.visible}}
            </div>                


            <strong>Visibility setting</strong><br>
            <input type="radio" v-model="p.visible" name="visibility" value="all" :checked="p.visible == 'all'"> All <br>
            <input type="radio" v-model="p.visible" name="visibility" value="fav" :checked="p.visible == 'fav'"> My favorites <br>
            <input type="radio" v-model="p.visible" name="visibility" value="none" :checked="p.visible == 'none'"> No one

          </div>
            <div><img" v-bind:src="BASE_URL +'/uploads/' + userId + '/'+ p.imgId" /> </div>
        </div>          


      </li>

      </ul>

这里出了什么问题，我该如何解决

：

v-model

将忽略在任何表单元素上找到的初始

值

、

选中的

或

选中的

属性。它将始终将Vue实例数据视为真相的来源。您应该在组件的

data

选项内的JavaScript端声明初始值

如果

v-model

与

value

相同，则该复选框将返回true。你的固定小提琴：

newvue({
el:“#应用程序”，
数据：{
照片：[{
“id”：“5BCEB6EFEA3147B7A22F0”，
“imgId”：“12710.png”，
“可见”：“全部”
},
{
“id”：“5BCEBF0FEAEA3147B7A22F1”，
“imgId”：“62818.png”，
“可见”：“fav”
},
{
“id”：“5BCE010FEAEA3147B7A22F2”，
“imgId”：“36740.png”，
“可见”：“无”
}
],
}
})

可见性：{p.visible}
可见性设置

全部

我的最爱

没有人

：

v-model

将忽略在任何表单元素上找到的初始

值

、

选中的

或

选中的

属性。它将始终将Vue实例数据视为真相的来源。您应该在组件的

data

选项内的JavaScript端声明初始值

如果

v-model

与

value

相同，则该复选框将返回true。你的固定小提琴：

newvue({
el:“#应用程序”，
数据：{
照片：[{
“id”：“5BCEB6EFEA3147B7A22F0”，
“imgId”：“12710.png”，
“可见”：“全部”
},
{
“id”：“5BCEBF0FEAEA3147B7A22F1”，
“imgId”：“62818.png”，
“可见”：“fav”
},
{
“id”：“5BCE010FEAEA3147B7A22F2”，
“imgId”：“36740.png”，
“可见”：“无”
}
],
}
})

可见性：{p.visible}
可见性设置

全部

我的最爱

没有人

如果从输入字段中删除：选中的属性怎么办？添加控制台log@EmtiazZahid然后什么都不检查。@NickSavenia您想在控制台中看到什么？没有错误。如果从输入字段中删除：checked属性，可能会出现重复的情况？添加控制台log@EmtiazZahid然后什么都不检查。@NickSavenia您想在控制台中看到什么？没有错误。可能是的重复项

   [ 
        {
            "id" : "5bcebb6efeaea3147b7a22f0",
            "imgId" : "12710.png",
            "visible" : "all"
        }, 
        {
            "id" : "5bcebbf0feaea3147b7a22f1",
            "imgId" : "62818.png",
            "visible" : "fav"
        }, 
        {
            "id" : "5bcec010feaea3147b7a22f2",
            "imgId" : "36740.png",
            "visible" : "none"
        }
    ],