🎨 tag页面参数改为query传递

ChanWahFung · ChanWahFung · commit 26b4381d68e0 · 2020-05-11T14:16:35.000+08:00
diff --git a/components/common/articItem.vue b/components/common/articItem.vue
@@ -16,12 +16,12 @@
         <li class="meta-item">{{ item.createdAt | formatTime }}</li>
         <li class="meta-item">
           <span v-if="item.tags.length && item.category" class="meta-item__tag">
-            <nuxt-link :to="'/tag/'+item.tags[0].title" target="_blank" @click.native="(e) => e.stopPropagation()">{{ item.tags[0].title }}</nuxt-link>
+            <nuxt-link :to="'/tag?name='+item.tags[0].title" target="_blank" @click.native="(e) => e.stopPropagation()">{{ item.tags[0].title }}</nuxt-link>
           </span>
           <span v-else v-for="tag in item.tags.slice(0, 2)" :key="tag.id" class="meta-item__tag">
-            <nuxt-link :to="'/tag/'+tag.title" target="_blank" @click.native="(e) => e.stopPropagation()">{{ tag.title }}</nuxt-link>
+            <nuxt-link :to="'/tag?name='+tag.title" target="_blank" @click.native="(e) => e.stopPropagation()">{{ tag.title }}</nuxt-link>
           </span>
-          <span v-if="item.category" class="meta-item__tag" :to="'/tag/'+item.category.name" target="_blank">{{ item.category.name }}</span>
+          <span v-if="item.category" class="meta-item__tag" :to="'/tag?name='+item.category.name" target="_blank">{{ item.category.name }}</span>
         </li>
       </ul>
       <p class="artic-item__title ellipsis" v-html="highlight.title || item.title"></p>
diff --git a/components/common/tagItem.vue b/components/common/tagItem.vue
@@ -1,5 +1,5 @@
 <template>
-  <nuxt-link :to="'/tag/'+item.title" target="_blank">
+  <nuxt-link :to="'/tag?name='+item.title" target="_blank">
     <div class="tag-item">
       <img :src="item.icon" class="tag-item__avatar">
       <div class="tag-item__info">
diff --git a/pages/detail/_id.vue b/pages/detail/_id.vue
@@ -25,7 +25,7 @@
         </div>
         <div class="tags">
           <p class="tags__title">关注下面的标签，发现更多相似文章</p>
-          <nuxt-link :to="'/tag/'+item.title" v-for="item in articInfo.tags" :key="item.id" class="tag" target="_blank">
+          <nuxt-link :to="'/tag?name='+item.title" v-for="item in articInfo.tags" :key="item.id" class="tag" target="_blank">
             <img class="tag__icon" :src="item.icon" />
             <span class="tag__title">{{ item.title }}</span>
           </nuxt-link>
diff --git a/pages/subscribe/_title.vue b/pages/subscribe/_title.vue
@@ -11,10 +11,10 @@
       </ul>
       <div class="tag-list">
         <div class="tag-item" v-for="item in tagList" :key="item.id">
-          <nuxt-link :to="'/tag/'+item.title" target="_blank">
+          <nuxt-link :to="'/tag?name='+item.title" target="_blank">
             <img class="item__icon" :src="item.icon">
           </nuxt-link>
-          <nuxt-link :to="'/tag/'+item.title" target="_blank">
+          <nuxt-link :to="'/tag?name='+item.title" target="_blank">
             <span class="item__title">{{ item.title }}</span>
           </nuxt-link>
           <span class="item__meta">{{ item.subscribersCount }} 关注  {{ item.entryCount }} 文章</span>
diff --git a/pages/tag/index.vue b/pages/tag/index.vue
@@ -24,10 +24,10 @@
 import reachBottom from '~/mixins/reachBottom'
 
 export default {
-  async asyncData({ app, params, error }) {
+  async asyncData({ app, query, error }) {
     // 标签详情
     const tagInfo = await app.$api.getTagDetail({
-      tagName: encodeURIComponent(params.tagName)
+      tagName: encodeURIComponent(query.name)
     }).then(res => {
       if (res.s === 1) {
         return res.d
@@ -53,12 +53,12 @@ export default {
   },
   head(){
     return {
-      title: `${this.$route.params.tagName} - 标签 - 掘金`
+      title: `${this.$route.query.name} - 标签 - 掘金`
     }
   },
   layout: 'full',
-  validate ({ params }) {
-    if (params.tagName && params.tagName != 'undefined') {
+  validate ({ query }) {
+    if (query.name && query.name != 'undefined') {
       return true
     }
     return false
