在网页设计过程中，选中背景颜色是非常重要的一个设计元素。当用户鼠标悬停在某个元素上时，为其添加高亮背景颜色可以帮助用户更加容易地理解页面结构和信息内容。在Vue框架中，也可以通过编写简单的代码实现这个功能。

首先，我们需要为目标元素绑定一个事件监听器，以便在用户鼠标悬停和离开时触发事件。在Vue中，可以通过v-on指令来完成这个操作，例如：

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

在这个例子中，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中很容易地实现选中背景颜色的功能。通过绑定事件监听器和定义方法，我们可以让用户体验更加优秀的网页设计。