Radio是我們在網頁上經常會使用的一個UI組件，在Vue中，我們可以便捷地通過v-model指令來實現Radio組件的雙向綁定。但有時候我們需要監聽Radio的選中事件，并且根據事件的觸發來做出一些特定的行為。那么，在Vue中，我們應該如何監聽Radio的選中事件呢？

<template>
<div>
<input type="radio" v-model="radioVal" value="1" @change="radioChange">選項1
<input type="radio" v-model="radioVal" value="2" @change="radioChange">選項2
</div>
</template>
<script>
export default {
data() {
return {
radioVal: ''
}
},
methods: {
radioChange() {
console.log('選中了' + this.radioVal)
}
}
}
</script>

在以上代碼中，我們使用了change事件來監聽Radio的選中事件，并將監聽函數定義在了methods中。當Radio選項被選中時，該方法被調用，console中將輸出被選中的選項。需要注意的是，我們需要通過v-model指令來綁定Radio的值，以方便我們獲取當前選項的值。

如果我們需要在選中Radio時，向后端發送請求并等待請求完成后才進行一些操作，我們可以將請求放在方法中，并利用computed屬性判斷當前Radio是否被選中。以下是示例代碼：

<template>
<div>
<input type="radio" v-model="radioVal" value="1">選項1
<input type="radio" v-model="radioVal" value="2">選項2
</div>
</template>
<script>
export default {
data() {
return {
radioVal: ''
}
},
computed: {
isRadioChecked() {
return this.radioVal !== ''
}
},
watch: {
isRadioChecked() {
if (this.isRadioChecked) {
this.sendRequest()
}
}
},
methods: {
async sendRequest() {
const res = await axios.post(`/api/action?radioVal=${this.radioVal}`)
console.log('請求完成')
}
}
}
</script>

在以上代碼中，我們使用了computed屬性來計算當前是否有Radio被選中，利用watch屬性來監聽isRadioChecked變量的變化。當變量變化時，我們調用sendRequest方法來發送請求。其中，我們使用了axios庫來發送post請求，等待請求返回后，console中將輸出"請求完成"。

以上是關于在Vue中監聽Radio的選中事件的介紹，通過上述方法，我們可以輕松地實現對Radio的事件監聽，并根據事件觸發來進行特定操作。