在開發過程中，我們常常會需要在多個頁面中使用相同的組件或模塊。如果每個頁面都單獨編寫這些組件，將會導致代碼冗長且難以維護。這時候，我們需要使用Vue提供的相同頁面復用的方法來提高代碼復用性。

Vue 提供了兩種方式實現頁面復用：組件和mixin（混入）。組件是基本的代碼復用單位，而mixin則為多個組件之間共享公共代碼提供了一個非常靈活的方式。

在 Vue 中，使用組件可以實現相同頁面復用。一個組件就是一個獨立的、可復用的 Vue 實例。組件的作用就是定義自己的模板、樣式、行為，然后在父組件中調用，以達到代碼復用的效果。

// 在父組件中添加子組件
<div id="app">
	<my-component></my-component>
</div>
// 子組件的定義
Vue.component('my-component', {
template: '<div>Hello World!</div>'
})

上述代碼中，我們在父組件中添加了一個子組件 my-component，并在作為模板的 template 屬性中定義了"Hello World!" 這段文本。這個組件可以在父組件的模板中被任何數量的復用。

而mixin是一種將組件中公共代碼抽離出來的方式，它可以在多個組件之間共享。在 Vue 中，使用 mixin 可以為任何組件添加一些公共屬性和方法，從而實現代碼的復用。

// 定義mixin
var myMixin = {
created: function () {
this.hello()
},
methods: {
hello: function () {
console.log('hello from mixin!')
}
}
}
// 定義組件
Vue.component('my-component', {
mixins: [myMixin],
created: function () {
console.log('hello from component!')
}
})
// 混合對象也可以直接使用
new Vue({
mixins: [myMixin],
created: function () {
console.log('hello from new Vue()!')
}
})

上述代碼中，我們定義了一個mixin對象 myMixin，并在組件和實例的選項中加入它來為它們添加公共的屬性和方法。這時，組件和實例都將輸出"hello from mixin!"。

在 Vue 中，我們可以通過兩種方式實現相同頁面的復用：組件和mixin。無論哪種方式，相同的代碼都可以被共享，并且盡可能地提高了代碼的復用性。