Merge pull request #24 from studygolang/isColt

deancn · web-flow · commit 70ef0faf4fe7 · 2020-03-22T22:24:49.000+08:00
#16, 使用wx-web-view
diff --git a/src/article/Index.vue b/src/article/Index.vue
@@ -1,57 +1,34 @@
 <template>
   <div class="page_article">
-    <header class="header">
+    <!-- <header class="header">
         <h1 class="title">
             {{ article.title }}
         </h1>
         <p class="desc">
         </p>
-    </header>
-    <article class="content" v-html="article.content">
-    </article>
+    </header> -->
+    <wx-web-view :src="url"></wx-web-view>
+    <!-- <article class="content" v-html="article.content">
+    </article> -->
   </div>
 </template>
 
 <script>
 import Vue from 'vue'
-import { articleDetail } from '../api/commont'
 
 export default Vue.extend({
   name: 'Article',
   data() {
     return {
       articleId: null,
-      article: {
-        author: {
-          avatar: 'http://img1.3lian.com/gif/more/11/2012/03/d037a77443c0a72a1432d815cd3b5724.jpg',
-          nickname: '昵称'
-        },
-        title: '什么是协程（goroutine），它们是怎样作的呢?',
-        description: '这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述',
-        like: 6,
-        comments: 10,
-        id: 12,
-        cover: ''
-      }
+      url: 'https://studygolang.com/articles/'
     }
   },
   created() {
     // 页面创建时取到文章的ID
     this.articleId = this.$route.params.id
-    // 获取文章详情
-    this.getDetail(this.articleId)
-  },
-  methods: {
-    getDetail(id) {
-      articleDetail(id).then((res) => {
-        console.log(res)
-        if (res.code === 0) {
-          this.article = res.data.article
-        } else {
-          console.log(res.msg)
-        }
-      })
-    }
+    // 组装URL
+    this.url = this.url + this.articleId
   }
 })
 </script>
diff --git a/src/component/ListContent.vue b/src/component/ListContent.vue
@@ -9,22 +9,22 @@
         <div class="article_detail" @click="jumpToDetail('/article/' + item.id)">
           <div class="artclie_text_msg">
             <div class="article_author">
-              <img class="img"  :src="item.author.avatar" mode='widthFix' alt="" />
-              <div class="nickname">{{item.author.nickname}}</div>
+              <!-- <img class="img"  :src="item.author.avatar" mode='widthFix' alt="" /> -->
+              <div class="nickname">{{item.author}}</div>
             </div>
             <div class="article_title">{{item.title}}</div>
-            <div class="article_description">{{item.description}}</div>
+            <!-- <div class="article_description">{{item.description}}</div> -->
           </div>
           <img class="img_cover" v-if="item.cover" :src="item.cover" alt mode='widthFix' />
         </div>
         <div class="article_other">
           <div class="like">
             <img class="img" src="http://static.gocoder.top/like.png" alt="" mode="widthFix">
-            {{item.like}}
+            {{item.likenum}}
           </div>
           <div class="acticle_comments">
             <img class="img" src="http://static.gocoder.top/comment.png" style="" alt="" mode="widthFix" >
-            {{item.comments}}
+            {{item.cmtnum}}
           </div>
           <div class="acticle_share">
             <wx-button open-type="share" style="background:#fff">
diff --git a/src/home/Tabs/Index.vue b/src/home/Tabs/Index.vue
@@ -35,32 +35,7 @@ export default Vue.extend({
         { label: '付费', key: 'pay' }
       ],
       activeKey: 'newest',
-      actclieList: [
-        {
-          author: {
-            avatar: 'http://img1.3lian.com/gif/more/11/2012/03/d037a77443c0a72a1432d815cd3b5724.jpg',
-            nickname: '昵称'
-          },
-          title: '什么是协程（goroutine），它们是怎样作的呢?,什么是协程（goroutine），它们是怎样作的呢?',
-          description: '这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述',
-          like: 6,
-          comments: 10,
-          id: 12,
-          cover: ''
-        },
-        {
-          author: {
-            avatar: 'http://img1.3lian.com/gif/more/11/2012/03/d037a77443c0a72a1432d815cd3b5724.jpg',
-            nickname: '昵称'
-          },
-          title: '什么是协程（goroutine），它们是怎样作的呢?什么是协程（goroutine），它们是怎样作的呢?什么是协程（goroutine），它们是怎样作的呢?',
-          description: '这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述这是描述',
-          like: 6,
-          comments: 10,
-          id: 13,
-          cover: 'http://img1.3lian.com/gif/more/11/2012/03/d037a77443c0a72a1432d815cd3b5724.jpg'
-        }
-      ]
+      actclieList: []
     }
   },
   components: {
@@ -74,7 +49,8 @@ export default Vue.extend({
   },
   created() {
     getArticles(1).then((res) => {
-      console.log(res)
+      // console.log(res)
+      this.actclieList = res.data.articles
     })
   }
 })
