vue.js在使用v-for中自訂id名稱

 因為我用Bootstrap來美化html的項目,剛好有數個需要指定id的radio元件,而且id還不能一樣。


因為用vue.js的v-for來產生數個radio元件,所以可以如下設定不同的ID名稱
主要加入這段:v-bind:id="'inlineRadio' + index"

<div  v-for="(items,index) in items" class="form-check form-check-inline">
    <input class="form-check-input" name="inlineRadioOptions" type="radio" v-bind:id="'inlineRadio' + index"  v-bind:value="items.name"  v-model="tag" >
    <label class="form-check-label" v-bind:for="'inlineRadio' + index">{{items.name}}</label>
</div>  

結果就如下圖,每個元件都有不同的ID名稱