hlm_pl_mall_h5/pages/home/article/Articleclass.vue

<template><page-meta :root-font-size="fontSize+'px'"></page-meta>
    <home-base :show="false"><view class="div container">
        <view class="div common-header-wrap">
          <view :style="'height:'+navHeight+'px'"></view>
          <view class="common-header-holder"></view>
          <view class="common-header-fixed">
            <title-header />
            <uni-nav-bar title="文章分类" class="common-header" left-icon="back" @clickLeft="goBack()">
            </uni-nav-bar>
          </view>
        </view>
        <view class="div class-list">
            <view class="div" v-for="item in articleclass_list" v-bind:key="item.ac_id" @click="goHomeArticlelist(item.ac_id)">
                <flex-line :is-link="true" :show-border="true">
                    <text class="span">{{item.ac_name}}</text>
                </flex-line>
            </view>
        </view>
        <empty-record v-if="articleclass_list && !articleclass_list.length"></empty-record>
    </view></home-base>
</template>

<script>
import {getFontSize} from '@/util/common'
import TitleHeader from '../../TitleHeader'
import { urlencode } from '@/util/common'
import HomeBase from '../HomeBase'
import { getArticleclassList } from '../../../api/homeArticle'
import EmptyRecord from '../../EmptyRecord'
import flexLine from '../../flexLine'
export default {
  components:{
      TitleHeader,
      HomeBase,
      flexLine,
    EmptyRecord
  },
  name: 'Articleclass',
  mounted(){
  // #ifdef  MP-WEIXIN
  this.navHeight = uni.getMenuButtonBoundingClientRect().top
  // #endif
  },
  computed:{
  fontSize(){
    return getFontSize()
  },
  },
  data(){
    return {
      navHeight: 0,
      articleclass_list: false
    }
  },
  created: function () {
    this.getArticleclassList()
  },
  methods:{
    goBack(){uni.navigateBack({delta:1})},
    getArticleclassList () {
      uni.showLoading({ title: '加载中' })
      getArticleclassList().then(res => {
        uni.hideLoading()
        this.articleclass_list = res.result.article_class
      }).catch(function (error) {
        uni.hideLoading()
        uni.showToast({icon:'none',title: error.message})
      })
    },
    goHomeArticlelist (acId) {
      uni.navigateTo({ url: '/pages/home/article/Articlelist'+'?'+urlencode( { ac_id: acId } )})
    }
  }
}
</script>

<style scoped lang="scss">
    .class-list{padding:0 $pageSpace;background: #fff}
</style>