ycwh/miniapp/pages/yuecai/snacks/detail/index.vue

<template>
  <view class="page-view f-30 p-40 flex-dir-column flex-x-center">
    <view class="title">{{detailVO.name}}</view>
    <view class="time">发布时间：{{detailVO.createTime?detailVO.createTime.substring(0,10) : ''}}</view>
    <view v-if="detailVO.videos" class="width-100">
      <video class="width-100" :src="detailVO.videos"></video>
    </view>
    <view class="col-info-d t-c m-b-30">
      <u-parse style="text-align: left;"  :content="detailVO.content"></u-parse>
    </view>
    <detailBottom type="snacks" :articleId.sync="detailVO.id" :liked.sync="detailVO.liked" :collected.sync="detailVO.collected"
      :views.sync="detailVO.views" :likeNum.sync="detailVO.likeNum" :collectNum.sync="detailVO.collectNum"
      @doRefresh="getDetail"></detailBottom>
  </view>
</template>

<script>
  import detailBottom from '@/pages/components/detailbottom.vue'
  export default {
    components: {
      detailBottom
    },
    data() {
      return {
        detailVO: {},
      }
    },
    methods: {
      getDetail() {
        this.$u.api.getSnacksDetail(this.detailVO.id).then(res => {
          if (res.data.content) {
            res.data.content = decodeURIComponent(res.data.content);
          }
          this.detailVO = res.data || {}
          //
          uni.setNavigationBarTitle({
            title: res.data.name || ''
          })
        })
      }
    },
    onLoad(options) {
      this.detailVO.id = options.id || '';
      this.getDetail();
    },
  }
</script>

<style scoped lang="scss">
  .title {
    width: 100%;
    text-align: center;
    font-size: 25px;
    color: #65371b;
    margin-bottom: 20px;
  }
  .time {
    font-size: 14px;
    color: #787878;
    font-weight: 300;
    padding-bottom: 10px;
  }
  
</style>