1、评论模板组件封装 2、评论详情显示

app.json

@@ -2,19 +2,14 @@
   "pages":[
       "pages/index/index",
       "pages/detail/detail",
-      "pages/comments/comments"
+      "pages/comments/comments",
+      "pages/section/section"
   ],
   "window":{
     "backgroundTextStyle":"dark",
     "navigationBarBackgroundColor": "#4abdcc",
     "navigationBarTitleText": "知乎日报",
     "navigationBarTextStyle":"white"
   },
-  "networkTimeout": {
-    "request": 10000,
-    "connectSocket": 10000,
-    "uploadFile": 10000,
-    "downloadFile": 10000
-  },
   "debug":true
 }

components/comments/comments.wxml

@@ -0,0 +1,21 @@
+
+<!--评论模板-->
+<template name="comments_item">
+    <view class="comments_item">
+        <view class="fl_left avatar">
+            <image class="userinfo_avatar" src="{{avatar}}"></image>
+        </view>
+        <view class="fl_left author_content">
+            <view>
+                <view class="fl_left">{{author}}</view>
+                <view class="fl_right">
+                    <image src="../../images/ico_like.png" style="width:22px;height:22px;"></image>
+                    {{likes}}
+                </view>
+                <view class="clearfix"></view>
+            </view>
+            <view>{{content}}</view>
+        </view>
+        <view class="clearfix"></view>
+    </view>
+</template>

doc/notes.js

@@ -0,0 +1,26 @@
+
+
+
+//  "tabBar": {
+//     "color": "#b0b0b0",
+//     "selectedColor": "#4abdcc",
+//     "borderStyle": "white",
+//     "backgroundColor": "#fff",
+//     "list": [{
+//       "pagePath": "pages/index/index",
+//       "iconPath": "images/index_normal.png",
+//       "selectedIconPath": "images/index_pressed.png",
+//       "text": "最新"
+//     }, {
+//       "pagePath": "pages/section/section",
+//       "iconPath": "images/section_normal.png",
+//       "selectedIconPath": "images/section_pressed.png",
+//       "text": "专栏"
+//     }]
+//   },
+//   "networkTimeout": {
+//     "request": 10000,
+//     "connectSocket": 10000,
+//     "uploadFile": 10000,
+//     "downloadFile": 10000
+//   },

pages/comments/comments.json

@@ -1,3 +1,3 @@
 {
-    "navigationBarTitleText": "知友评轮"
+    "navigationBarTitleText": "知友评论"
   }

pages/comments/comments.wxml

@@ -1,24 +1,40 @@
 <!--comments.wxml-->
 
+<!--引用模板comments.wxml文件-->
+<import src="../../components/comments/comments.wxml"/>
 
 <view class="container">
     <!--长评-->
-    <view style="border-bottom:1px solid #dedede;padding:5px;background-color:#fff;font-size:18px;">
+    <view class="comment_counts">
         {{longCommentCounts}}条长评轮
     </view>
-    <view>
-        <block wx:for="{{longComments}}">
-            <view style="border-bottom:1px solid #dedede;padding:10px;background-color:#fff;">{{item.content}}</view>
+    <view class="comments_list">
+        <block wx:for="{{longComments}}" wx:for-item="item">
+            <template is="comments_item" data="{{avatar:item.avatar,author:item.author,content:item.content,likes:item.likes}}"/>
         </block>
     </view>
     <!--短评-->
     <view>
-        <view style="border-bottom:1px solid #dedede;padding:5px;background-color:#fff;font-size:18px;">
+        <view class="comment_counts">
             {{shortCommentCounts}}条短评轮
         </view>
-         <block wx:for="{{shortComments}}">
-            <view style="border-bottom:1px solid #dedede;padding:10px;background-color:#fff;">{{item.content}}</view>
-          </block>
+        <view class="comments_list">
+            <block wx:for="{{shortComments}}" wx:for-item="item">
+                 <template is="comments_item" data="{{avatar:item.avatar,author:item.author,content:item.content,likes:item.likes}}"/>
+
+
+                <!--<view class="comments_item">
+                    <view class="fl_left avatar">
+                        <image class="userinfo_avatar" src="{{item.avatar}}"></image>
+                    </view>
+                    <view class="fl_left author_content">
+                        <view>{{item.author}}</view>
+                        <view>{{item.content}}</view>
+                    </view>
+                    <view class="clearfix"></view>
+                </view>-->
+            </block>
+          </view>
     </view>
 
 </view>

pages/comments/comments.wxss

@@ -0,0 +1,23 @@
+
+
+/*用户头像*/
+.userinfo_avatar {
+  width: 28px;
+  height: 28px;
+  border-radius: 50%;
+}
+
+.comment_counts{
+    border-bottom:1px solid #dedede;padding:5px;background-color:#fff;font-size:18px;
+}
+
+.comments_item{
+    border-bottom:1px solid #dedede;padding:10px;background-color:#fff;
+}
+
+.comments_item .avatar{
+    width:32px;
+}
+.comments_item .author_content{
+    width:calc(100% - 32px);
+}

pages/section/section.js

@@ -0,0 +1,15 @@
+
+
+// section.js
+
+// 页面注册
+Page({
+
+    data:{
+
+    },
+    onLoad:function(){
+
+    }
+
+})

pages/section/section.json

@@ -0,0 +1,3 @@
+{
+    "navigationBarTitleText": "日报专栏"
+  }

pages/section/section.wxml

@@ -0,0 +1,8 @@
+
+
+<!--section.wxml-->
+
+<view class="container">
+
+    <view>section</view>
+</view>