文章搜索 - 显示推荐搜索

Author: ppambler

project/imooc-blog/api/search.js

@@ -0,0 +1,15 @@
+/*
+ * @Date: 2021-12-21 21:21:21
+ * @LastEditTime: 2021-12-21 21:21:23
+ * @FilePath: \imooc-blog\api\search.js
+ */
+import request from "@/utils/request";
+
+/**
+ * 默认搜索内容
+ */
+export function getDefaultText() {
+  return request({
+    url: "/search/default-text",
+  });
+}

project/imooc-blog/subpkg/pages/search-blog/search-blog.vue

@@ -1,6 +1,6 @@
 <!--
  * @Date: 2021-12-21 16:33:53
- * @LastEditTime: 2021-12-21 20:44:59
+ * @LastEditTime: 2021-12-21 21:22:21
  * @FilePath: \imooc-bloge:\BlogDemo\imooc-uni-app\project\imooc-blog\subpkg\pages\search-blog\search-blog.vue
 -->
 <template>
@@ -25,6 +25,7 @@
 </template>
 
 <script>
+import { getDefaultText } from "@/api/search";
 export default {
   data() {
     return {
@@ -34,6 +35,9 @@ export default {
       defaultText: "默认的 placeholderText",
     };
   },
+  created() {
+    this.loadDefaultText();
+  },
   methods: {
     /**
      * 搜索内容
@@ -63,6 +67,13 @@ export default {
     onSearchCancel(val) {
       console.log("searchbar 取消按钮");
     },
+    /**
+     * 获取推荐搜索文本
+     */
+    async loadDefaultText() {
+      const { data: res } = await getDefaultText();
+      this.defaultText = res.defaultText;
+    },
   },
 };
 </script>