hlm_pl_mall_h5/pages/home/pointsgoods/Detail.vue

<!-- 商品详情 -->
<template><page-meta :root-font-size="fontSize+'px'"></page-meta>
    <home-base :show="false" ><view class="div product-detail-wrapper" v-if="productDetail">
        <!-- header  -->
        <detail-header v-if="!isPreviewPicture"></detail-header>
        <!-- body -->
        <detail-body :isStock="productDetail.pgoods_storage"></detail-body>
        <!-- footer -->
        <detail-footer v-if="!isPreviewPicture"></detail-footer>
        <!-- 预览图片 -->
        <preview-picture
        ></preview-picture>

    </view></home-base>
</template>

<script>
import {getFontSize} from '@/util/common'
import HomeBase from '../HomeBase'
import DetailHeader from './DetailHeader'
import DetailBody from './DetailBody'
import DetailFooter from './DetailFooter'
import PreviewPicture from './child/PreviewPicture'
import { getPointsgoodsInfo } from '../../../api/homePointsgoods'

import { mapState, mapMutations, mapActions } from 'vuex'

export default {
  data () {
    return {
      productId: '',
      productDetail: {},
    }
  },

  components:{
    HomeBase,
    DetailHeader,
    DetailBody,
    DetailFooter,
    PreviewPicture
  },

  onLoad: function (option) {
    this.productId=option.pgoods_id ? option.pgoods_id : ''
    this.getDetail()
    this.saveCartState(false)
  },

  computed: {
  fontSize(){
    return getFontSize()
  },
  ...mapState({
    isPreviewPicture: state => state.pointsgoods.isPreviewPicture,
  })
  },

  mounted () {
    this.$nextTick(() => {})
  },
  methods: {
    ...mapMutations({
      saveInfo: 'saveDetailInfo',
      saveCommendList: 'saveCommendList',
      saveCartState: 'saveCartState',
      setCurrentProductId: 'setCurrentProductId'
    }),


    /*
    getDetail: 获取商品详情， 并且存入状态管理
    */
    getDetail () {
      this.setCurrentProductId(this.productId)
        getPointsgoodsInfo(this.productId).then(res => {
        if (res) {
          this.productDetail = res.result.goods_info
          uni.setNavigationBarTitle({
          	title: this.productDetail.goods_name
          })
          this.saveInfo(res.result.goods_info)
          this.saveCommendList(res.result.goods_commend_list)
        }
      })
    }

  }
}
</script>

<style lang="scss" scoped>
    .product-detail-wrapper {
        height: 100%;
        width: auto;
    }
</style>