首页接口

src/components/seachModule/seachModule.vue

@@ -57,10 +57,10 @@
                         </div>
                     </div>
                     <div class="seach-info-box dis-f">
-                        <seachInfo title="学校附近" :btn="seachSchoolBtn" seachType="1"></seachInfo>
-                        <seachInfo title="合租" seachType="2" :btn="hireType"></seachInfo>
-                        <seachInfo title="区域找房" seachType="3" style="margin-top:30px;" :btn="seachArea"></seachInfo>
-                        <seachInfo title="整租" seachType="2" style="margin-top:30px;" :btn="allHireType"></seachInfo>
+                        <seachInfo title="学校附近" :btn="seachSchoolBtn.data" seachType="1"></seachInfo>
+                        <seachInfo title="合租" seachType="2" :btn="hireType.data"></seachInfo>
+                        <seachInfo title="区域找房" seachType="3" style="margin-top:30px;" :btn="seachArea.data"></seachInfo>
+                        <seachInfo title="整租" seachType="2" style="margin-top:30px;" :btn="allHireType.data"></seachInfo>
                     </div>
                     <!--  -->
                     <!-- <div>
@@ -73,46 +73,41 @@
 </template>
   
 <script setup>
-import { ref } from 'vue';
+import { ref, defineProps, watchEffect,reactive,watch } from 'vue';
 import seachInfo from '../indexSeachInfo/indexSeachInfo.vue';
 import selectTabBox from "../selectTabBox/selectTabBox.vue";
+import { useRouter} from 'vue-router'
+//监听路由
+const router = useRouter()
+watch(()=>router.currentRoute.value,(nVal)=>{
+    console.log(nVal)
+})
+
+const props = defineProps({
+    list: {
+        type: Array,
+        default: function () {
+            return []
+        }
+    }
+})
 //搜索框
 let seachValue = ref('')
 let historyShow = ref(false);
 let setHistoryShow = () => {
     historyShow.value = !historyShow.value
 }
+let seachSchoolBtn=reactive({data:[]});//学校地区
+let hireType={};//整租
+let allHireType={};//合租
+let seachArea={};//区域找房
+watchEffect(() => {
+    seachSchoolBtn.data = props.list[0] ? props.list[0].where : []
+    hireType.data = props.list[2] ? props.list[2].where[0].data : []
+    allHireType.data = props.list[2] ? props.list[2].where[1].data : []
+    seachArea.data = props.list[1] ? props.list[1].where : []
+})
 
-let seachSchoolBtn = [
-    { text: '港大' },
-    { text: '科大' },
-    { text: '中大' },
-    { text: '城大' },
-    { text: '理工' },
-    { text: '浸会' },
-    { text: '教大' },
-    { text: '岭大' },
-]
-let hireType = [
-    { text: '不限' },
-    { text: '房间' },
-    { text: '床位' },
-    { text: '客厅' },
-    { text: '其他' },
-]
-let allHireType = [
-    { text: '不限' },
-    { text: 'studio' },
-    { text: '一房' },
-    { text: '两房' },
-    { text: '三房' },
-    { text: '四房以上' }
-]
-let seachArea = [
-    { text: '港岛',data:[{title:1,id:1},{title:2,id:2},{title:3,id:3},{title:4,id:4}] },
-    { text: '九龙',data:[{title:5,id:5},{title:2,id:2},{title:3,id:3},{title:7,id:7}] },
-    { text: '新界',data:[{title:6,id:6},{title:8,id:8},{title:11,id:11},{title:9,id:9}] }
-]
 let historyArr = [
     { title: '有阳台' },
     { title: '有洗衣机' },
@@ -128,13 +123,6 @@ defineExpose({
     seachValue
 })
 </script>
-<script>
-export default {
-    props: {
-
-    }
-}
-</script>
 <style scoped>
 .dis-f {
     display: flex;
@@ -197,14 +185,16 @@ export default {
                 -moz-box-shadow: none;
                 -webkit-box-shadow: none;
                 box-shadow: none;
-                margin-left:20px;
-                .text-img{
-                    width:100px;
-                    height:26px;
+                margin-left: 20px;
+
+                .text-img {
+                    width: 100px;
+                    height: 26px;
                 }
-                .code-img{
-                    width:20px;
-                    height:20px;
+
+                .code-img {
+                    width: 20px;
+                    height: 20px;
                 }
             }