fix首页切换bug

Author: flytam

README.md

@@ -40,19 +40,18 @@ npm run dev
 目前已经完成了绝大部分功能，尚未完成的功能在和遇到的问题在todo中
 
 目前存在的问题
+
 ～～小程序无法动态插入dom，markdwon的解析有点问题， [wemark](https://github.com/TooBug/wemark)在mpvue上使用需要改造下。已封装[mpvue-wemark](https://github.com/673800357/mpvue-wemark)解决
 
 
 todo
 
-  - 帖子评论、回复功能
   - 帖子收藏和取消收藏功能
-  - 评论点赞和收藏的UI同步
+  - 评论点赞和收藏的UI同步 // 好像后端有bug
   - 帖子详情页加载评论时惰性渲染和回到顶部
   - 编辑自己发过的主题
   - 展示未读消息数和消息已读
   - 部分页面添加下拉刷新
-  - 主页几个tab切换有点bug
   - 请求失败状态码非200会抛异常，如何统一优雅处理
 后话：
 

src/components/sendReply.vue

@@ -23,7 +23,6 @@ export default {
   methods: {
     prevent() {},
     async send() {
-      console.log(this.content, this.replyId, this.topicId);
       const accesstoken = wx.getStorageSync("accesstoken");
       try {
         const res = await this.$http.post(

src/pages/detail/index.vue

@@ -38,7 +38,7 @@
               <wemark :mdData='item.content'></wemark>
             </p>
             <div class='foot'>
-              <div :data-replyid='item.id' :data-originindex='originindex' @click.stop="upOrCancel($event)"><img class='icon' v-if='!item.is_uped' src='../../../static/good1.png' /><img class='icon' v-if='item.is_uped' src='../../../static/good2.png' /><span>点赞:{{item.ups.length}}</span></div>
+              <div :data-replyid='item.id' :data-originindex='originindex' @click.stop="upOrCancel($event)"><img class='icon' :src="(!item.is_uped)?'../../../static/good1.png':'../../../static/good2.png'" /><span>点赞:{{item.ups.length}}</span></div>
               <div :data-loginname='item.author.loginname' @click.stop="showReplyModal($event)" :data-replyid='item.id'><img class='icon' src='../../../static/chat.png' /><span>回复</span></div>
             </div>
           </div>
@@ -104,6 +104,7 @@ export default {
       // console.log(e);
       const accesstoken = wx.getStorageSync("accesstoken");
       if (accesstoken) {
+        try{
         const res = await this.$http.post(
           `${api}/reply/${e.currentTarget.dataset.replyid}/ups`,
           {
@@ -116,13 +117,17 @@ export default {
             icon: "none",
             duration: 2000
           });
-        } else {
+        }
+        this.getData();
+        }catch(e){
           wx.showToast({
-            title: res.data.error_msg,
+            title: e.response.data.error_msg,
             icon: "none",
             duration: 2000
           });
         }
+
+
         //  originindex
       } else {
         wx.showToast({

src/pages/index/index.vue

@@ -1,17 +1,19 @@
 <template>
   <div class='container'>
     <div class='header'>
-      <div  :class='{ active: tab==="all" }' @click.stop='changeTab($event)' data-tab='all'>全部</div>
+      <div :class='{ active: tab==="all" }' @click.stop='changeTab($event)' data-tab='all'>全部</div>
       <div :class='{ active: tab==="good" }' @click.stop='changeTab($event)' data-tab='good'>精华</div>
       <div :class='{ active: tab==="share" }' @click.stop='changeTab($event)' data-tab='share'>分享</div>
       <div :class='{ active: tab==="job" }' @click.stop='changeTab($event)' data-tab='job'>招聘</div>
       <div :class='{ active: tab==="ask" }' @click.stop='changeTab($event)' data-tab='ask'>问答</div>
     </div>
-    <scroll-view scroll-y class='scroll-container' @scrolltolower='getMore'>
-      <div v-for='item in cardData' :key='item.id'>
-        <card :item='item'></card>
-      </div>
-    </scroll-view>
+    <div v-for='(listItem,listIndex) in list' :key='listIndex' v-show="listItem===tab">
+      <scroll-view scroll-y class='scroll-container' @scrolltolower='getMore'>
+        <div v-for='item in cardData[listItem]' :key='item.id'>
+          <card :item='item'></card>
+        </div>
+      </scroll-view>
+    </div>
   </div>
 </template>
 
@@ -24,11 +26,22 @@ export default {
     return {
       page: 0,
       tab: "all",
-      cardData: [],
-      isLoading: false
+      cardData: {
+        all: [],
+        good: [],
+        share: [],
+        job: [],
+        ask: []
+      },
+      isLoading: false,
+      list: ["all", "good", "share", "job", "ask"]
+      // all: [],
+      // good: [],
+      // share: [],
+      // job: [],
+      // ask: []
     };
   },
-
   components: {
     card
   },
@@ -38,7 +51,9 @@ export default {
   },
   methods: {
     async getData(tab, page) {
-      wx.showLoading({ title: "加载中" });
+      wx.showLoading({
+        title: "加载中"
+      });
       this.isLoading = true;
       const res = await this.$http.get(`${api}/topics`, {
         tab,
@@ -47,14 +62,15 @@ export default {
       });
       wx.hideLoading();
       if (res.data.success) {
-        if (this.cardData.length > 0 && page === 0) {
+        if (this.cardData[tab].length > 0 && page === 0) {
           // 下拉刷新
-          console.log("新的", res.data.data, tab);
-          this.cardData = res.data.data;
+           console.log("新的", res.data.data, tab);
+          
+          this.cardData[tab] = res.data.data;
           // res.data.data;
         } else {
           // 底部加载更多 h和初始得时候
-          this.cardData = [...this.cardData, ...res.data.data];
+          this.cardData[tab] = [...this.cardData[tab], ...res.data.data];
         }
       } else {
         // 获取数据失败