在Vue的開發中，我們常常要處理與用戶的輸入相關的問題，其中包括單選框。Vue為我們提供了一種方便的使用單選框的方式——input vue radio。

<template>
<div>
<label><input type="radio" v-model="picked" value="a"> A</label>
<label><input type="radio" v-model="picked" value="b"> B</label>
<p>Selected: {{ picked }}</p>
</div>
</template>
<script>
export default {
data() {
return {
picked: 'a'
}
}
}
</script>

如上所示，v-model指令用于綁定單選框的值，而value屬性則用于指定選項的值。我們還可以在頁面上顯示當前選中的選項的值，方便用戶確認選擇是否正確。

當然，input vue radio并不僅僅可以用于綁定簡單值，還可以使用對象或數組。

<template>
<div>
<label><input type="radio" v-model="picked" :value="obj"> Object</label>
<label><input type="radio" v-model="picked" :value="arr"> Array</label>
<p>Selected: {{ picked }}</p>
</div>
</template>
<script>
export default {
data() {
return {
picked: null,
obj: {
message: 'Hello'
},
arr: ['1', 2, true]
}
}
}
</script>

上述代碼中，我們使用對象和數組來作為每個選項的值。在選中其中一個選項時，picked的值會分別變為相應的對象和數組。這種方式可以幫助我們更方便地處理復雜的用戶輸入。

最后，我們可以使用一個單獨的數組來渲染一組單選框，這常常用于動態生成選項的場景。

<template>
<div>
<label v-for="option in options" :key="option">
<input type="radio" v-model="picked" :value="option"> {{ option }}
</label>
<p>Selected: {{ picked }}</p>
</div>
</template>
<script>
export default {
data() {
return {
picked: null,
options: ['A', 'B', 'C']
}
}
}
</script>

上述代碼中，我們使用v-for指令來循環渲染一個單選框組，并動態綁定選項的值。這種方式極大地方便了我們生成和管理大量選項。