vuejs設置檢查單選按鈕，如果聲明是真實的

Question

我試圖做一個單選按鈕使用vuejs V-託運只有當我的if語句是真實的。有沒有辦法使用vuejs的v-if/v-else來解決這類問題？

在PHP和HTML我可以通過執行實現這一目標如下：

<input type="radio" <? if(portal.id == currentPortalId) ? 'checked="checked"' : ''?>> 

下面是我到目前爲止所使用vuejs：

<div v-for="portal in portals"> 
<input type="radio" id="{{portal.id}}" name="portalSelect" 
    v-bind:value="{id: portal.id, name: portal.name}" 
    v-model="newPortalSelect" 
    v-on:change="showSellers" 
    v-if="{{portal.id == currentPortalId}}" 
    checked="checked"> 
<label for="{{portal.id}}">{{portal.name}}</label> 
</div> 

我知道V-if語句這裏用於檢查是否顯示或隱藏輸入。

任何幫助將是非常讚賞。

Answer 1

您可以在checked屬性綁定這樣的：

<div v-for="portal in portals"> 
    <input type="radio" 
     id="{{portal.id}}" 
     name="portalSelect" 
     v-bind:value="{id: portal.id, name: portal.name}" 
     v-model="newPortalSelect" 
     v-on:change="showSellers" 
     :checked="portal.id == currentPortalId"> 

    <label for="{{portal.id}}">{{portal.name}}</label> 
</div> 

簡單的例子：https://jsfiddle.net/b4k6tpj9/