在Vue.js中，處理表單是一項基本任務。其中，處理復選框的值是常見的需求。Vue提供了一個強大的指令 v-model 來實現數據和DOM之間的雙向綁定。在復選框的情況下，v-model綁定的是checkbox的checked屬性。

下面是一個簡單的例子，展示了如何使用v-model實現復選框的選中狀態：

<template>
<div>
<label>
<input type="checkbox" v-model="isChecked">
勾選我
</label>
<p v-if="isChecked">我被選中了！</p>
</div>
</template>
<script>
export default {
data() {
return {
isChecked: false
}
}
}
</script>

在上述代碼中，我們使用v-model指令綁定了isChecked變量到復選框的checked屬性。isChecked的值會隨著復選框的選中狀態而改變。此外，我們還使用了v-if指令來展示是否被選中的狀態。

如果我們想使用一個數組來存儲復選框的值，應該怎么辦呢？Vue對此提供了非常棒的支持。我們可以綁定一個數組到checkbox的value屬性上，然后使用v-model來實現雙向綁定。當復選框被選中時，對應的value值將被添加到數組中。相反地，如果復選框被取消選中，則對應的value值將從數組中移除。

下面是一個示例代碼，展示了如何使用一個數組來存儲多個復選框的值：

<template>
<div>
<label>
<input type="checkbox" value="apple" v-model="selectedFruits">
蘋果
</label>
<label>
<input type="checkbox" value="banana" v-model="selectedFruits">
香蕉
</label>
<label>
<input type="checkbox" value="orange" v-model="selectedFruits">
橘子
</label>
<p>你選中的水果是{{selectedFruits}}</p>
</div>
</template>
<script>
export default {
data() {
return {
selectedFruits: []
}
}
}
</script>

在上述代碼中，我們綁定了一個空數組到selectedFruits變量上。當復選框被選中時，對應的value值將被添加到selectedFruits數組中，反之亦然。最后，我們使用插值表達式來展示選中的水果數組。