在網頁設計過程中，選中背景顏色是非常重要的一個設計元素。當用戶鼠標懸停在某個元素上時，為其添加高亮背景顏色可以幫助用戶更加容易地理解頁面結構和信息內容。在Vue框架中，也可以通過編寫簡單的代碼實現這個功能。

首先，我們需要為目標元素綁定一個事件監聽器，以便在用戶鼠標懸停和離開時觸發事件。在Vue中，可以通過v-on指令來完成這個操作，例如：

< div v-on:mouseover="changeBgColor" v-on:mouseout="resetBgColor" >This is a target element.

在這個例子中，v-on指令指定了兩個事件監聽器，分別為mouseover和mouseout，分別觸發changeBgColor和resetBgColor方法。接下來，我們需要在Vue實例中定義這兩個方法，例如：

var app = new Vue({
el: '#app',
methods: {
changeBgColor: function() {
// 在這里添加選中時的顏色樣式
},
resetBgColor: function() {
// 在這里移除選中時的顏色樣式
}
}
})

在這里，我們給Vue實例定義了changeBgColor和resetBgColor兩個方法，用于在用戶鼠標觸發事件時分別添加和移除選中時的背景顏色。接下來，我們需要在changeBgColor方法中添加選中時的背景顏色樣式：

changeBgColor: function() {
this.$refs.target.style.backgroundColor = '#f0f0f0';
}

在這里，我們使用了this.$refs.target來獲取目標元素的引用，并為其設置了背景顏色樣式。當用戶鼠標懸停在目標元素上時，這個方法會被觸發，從而為目標元素添加了選中時的顏色樣式。

接下來，我們需要在resetBgColor方法中移除背景顏色樣式：

resetBgColor: function() {
this.$refs.target.style.backgroundColor = '';
}

在這里，我們為目標元素的背景顏色樣式設置了一個空值，從而移除了選中時的顏色樣式。當用戶鼠標從目標元素上移開時，這個方法會被觸發，從而移除了目標元素的背景顏色樣式。

通過上面的代碼實現，我們可以在Vue中很容易地實現選中背景顏色的功能。通過綁定事件監聽器和定義方法，我們可以讓用戶體驗更加優秀的網頁設計。