热搜词缓存

buyer/src/components/Search.vue

@@ -27,6 +27,7 @@
           <Tag
             v-for="(item, index) in promotionTags"
             :key="index"
+            class="mr_10"
           >
             <span class="hover-color" @click="selectTags(item)">{{ item }}</span>
           </Tag>
@@ -37,6 +38,7 @@
 </template>
 
 <script>
+import storage from '@/plugins/storage.js'
 import {hotWords} from '@/api/goods.js'
 export default {
   name: 'search',
@@ -61,7 +63,6 @@ export default {
   data () {
     return {
       searchData: '', // 搜索内容
-      promotionTags: [] // 热门搜索列表
     };
   },
   methods: {
@@ -79,22 +80,28 @@ export default {
       this.$emit('search', this.searchData)
     }
   },
-  mounted () {
+  computed:{
+    promotionTags () {
+      return JSON.parse(this.$store.state.hotWordsList)
+    }
+  },
+  created () {
     this.searchData = this.$route.query.keyword
     if (!this.hover) { // 首页顶部固定搜索栏不调用热词接口
       // 搜索热词每一小时请求一次
-      const reloadTime = this.Cookies.getItem('hotWordsReloadTime')
+      const reloadTime = storage.getItem('hotWordsReloadTime')
       const time = new Date().getTime() - 60*60*1000
       if (!reloadTime) {
         hotWords({count: 5}).then(res => {
-          if (res.success) this.promotionTags = res.result
+          console.log(res);
+          if (res.success) storage.setItem('hotWordsList', res.result)
         })
-        this.Cookies.setItem('hotWordsReloadTime',new Date().getTime())
+        storage.setItem('hotWordsReloadTime',new Date().getTime())
       } else if (reloadTime && time > reloadTime) {
         hotWords({count: 5}).then(res => {
-          if (res.success) this.promotionTags = res.result
+          if (res.success) storage.setItem('hotWordsList', res.result)
         })
-        this.Cookies.setItem('hotWordsReloadTime',new Date().getTime())
+        storage.setItem('hotWordsReloadTime',new Date().getTime())
       }
       
     }

buyer/src/vuex/mutations.js

@@ -9,3 +9,6 @@ export const SET_NAVLIST = (state, data) => {
 export const SET_CARTNUM = (state, data) => {
   state.cartNum = data
 }
+export const SET_HOTWORDS = (state, data) => {
+  state.hotWordsList = data
+}

buyer/src/vuex/store.js

@@ -10,9 +10,10 @@ Vue.use(Vuex);
 export default new Vuex.Store({
   state: {
     category: [], // 全部分类
-    navList: [],
+    navList: [], // 首页快捷导航
     cartNum: storage.getItem('cartNum') || 0,
-    logoImg: require('@/assets/images/logo2.png')
+    logoImg: require('@/assets/images/logo2.png'),
+    hotWordsList: storage.getItem('hotWordsList') || []
   },
   getters,
   actions,