monk页面复用背景图片组件

pages/monk/monk.vue

@@ -1,6 +1,6 @@
 <template>
   <view class="page">
-    <image class="background-image" :src="CommonEnum.BACKGROUND" mode="aspectFill"></image>
+    <base-background />
     <!-- 使用自定义导航栏组件 -->
     <custom-navbar title="寺庙高僧" />
 		<view class="header">
@@ -43,10 +43,12 @@
 		getMonkList
 	} from '@/api/monk/monk.js'
 	import CustomNavbar from "../../components/custom-navbar/custom-navbar.vue";
+	import BaseBackground from "../../components/base-background/base-background.vue";
 
 	export default {
 		components: {
-			CustomNavbar
+			CustomNavbar,
+			BaseBackground
 		},
 		data() {
 			return {
@@ -126,16 +128,7 @@
   position: relative;
 }
 
-	.background-image {
-		position: absolute;
-		top: 0;
-		left: 0;
-		width: 100%;
-		height: 100%;
-		z-index: -1;
-		border-radius: 16rpx;
-		/* 确保背景图不被导航栏遮挡 */
-	}
+
 
 	.searchBox {
   display: flex;