當開發Vue項目時，我們經常需要通過JavaScript操作DOM元素來實現一些功能，比如設置body滾動等。下面我們將介紹如何使用Vue來設置body滾動。

首先，我們需要了解Vue的mounted鉤子函數，它在Vue實例掛載到DOM上之后立即調用。在這個鉤子函數中，我們可以獲取到DOM元素并進行操作。

mounted(){
document.body.style.overflow = 'hidden';//禁止滾動
}

上面的代碼可以通過設置body的overflow屬性為'hidden'來禁止頁面滾動。但是，當我們需要恢復頁面滾動時，我們需要將overflow屬性重置為其原始值。下面是一個完整的例子：

在上面的例子中，我們使用了beforeDestroy鉤子函數來恢復頁面滾動。該鉤子函數在Vue實例銷毀之前調用。

除此之外，我們還可以使用一些插件來實現頁面滾動的設置。比如，vue-body-scroll-lock插件可以讓我們更加方便地控制頁面滾動。

上面的例子中，我們首先需要引入vue-body-scroll-lock插件。然后，在mounted鉤子函數中使用disableBodyScroll方法禁止頁面滾動，在beforeDestroy鉤子函數中使用enableBodyScroll方法恢復滾動。

最后，我們需要注意的是，在使用Vue設置body滾動時，我們需要避免污染全局作用域，以免影響其他模塊的功能。因此，建議將設置body滾動的代碼封裝在一個獨立的模塊中，通過Vue插件的形式進行調用。