资讯列表，详情优化

Administrator

2021-06-19 f6bb88e1f21de51f8d39de6fe5956053fb5a62ca

 pages/article/article_detail.vue

@@ -5,17 +5,18 @@
         <view class="banner-title">{{article.title}}</view>
      </view>
      
		
      <view class="article-content">
         <video id="myVideo" class="video" v-if="video" :src="article.videoUrl" muted="false" @error="videoErrorCallback"></video>
         <u-parse :content="content" @navigate="navigate"></u-parse>
      </view>
		
      <view class="article-meta">
         <view class="article-author">{{article.sourceName}}</view>
         <text class="article-text">发表于</text>
         <text class="article-time">{{article.createTime}}</text>
      </view>
		
		
      <view class="article-content">
         <!-- <video id="myVideo" class="video" v-if="video" :src="article.videoUrl" muted="false" @error="videoErrorCallback"></video> -->
         <u-parse :content="content" @navigate="navigate"></u-parse>
      </view>
		
   </view>
</template>

@@ -97,39 +98,43 @@
      // background-color: #007AFF;
      width: 100%;
      height: 80rpx;
      position: relative;
      top: 40rpx;
      font-size: 24rpx;
      color: #808080;
      display: flex;
      flex-direction: row;
      align-items: center;
      position: relative;
      left: 20rpx;
      // justify-content: center;
      // font-weight: 550;
      
      
      .article-author{
         position: relative;
         left: 20rpx;
         letter-spacing: 1px;
         float: left;
      }
      
      .article-text{
         position: relative;
         left: 20rpx;
         left: 15px;
      }
      
      .article-time{
         position: relative;
         left: 50rpx;
         left: 30px;
      }
   }
   
   .article-content{
      position: relative;
      top: 20rpx;
      left: 3%;
      bottom: 2%;
      width: 94%;
      border-bottom: 1px solid rgba(128,128,128,0.1);
      margin-bottom: 20px;
      // border-bottom: 1px solid rgba(128,128,128,0.1);
      
      .video{
         width: 100%;
      }
      // .video{
      //    width: 100%;
      // }
   }
</style>