<template> <view> <image class="width94 mart20" mode="widthFix" :src="imagewxUrl+imgadres"></image> <!-- 分割线 --> <view class="title-split"> <view></view> <text>品牌分类</text> <view></view> </view> <view v-if="brandByList == '' " class="mart60 fotct font14 fcor666"> <image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres1"></image> </view> <!-- 分类--> <view class="width94"> <view class="width50 flleft fotct mart5" v-for="(item,index) in brandByList" :key="item" @click="jumpgoods(item.id)"> <image :src="imageUrl+item.img" class="preimg"></image> </view> </view> </view> </template> <script> import {getBrandByList} from '../../Utils/Api.js'; let app = getApp() export default { data() { return { imageUrl: app.globalData.imgUrl, imagewxUrl: app.globalData.imageWxImg, brandByList:[], imgadres: 'brand.png', imgadres1: 'noorder.png', pageNum: 1, pageSize: 10, isNoMoreData: false, desId:'' } }, onLoad(options) { this.desId = options.id; this.getBrandByList(); }, onReachBottom() { this.getBrandByList(); }, methods: { //查询品牌 getBrandByList() { uni.showLoading({ title: '加载中...' }) if (this.isNoMoreData) { uni.hideLoading() return false; } let pagenum = this.pageNum; let params = { pageNum: pagenum, pageSize: this.pageSize, goodTypeId : this.desId } getBrandByList(params).then(res => { uni.hideLoading(); if (res.return_code == '000000') { this.isNoMoreData = res.return_data.list.length == this.pageSize ? false : true; this.brandByList = this.brandByList.concat(res.return_data.list); if (res.return_data.total == (this.pageNum * this.pageSize)) { this.isNoMoreData = true; } this.pageNum = res.return_data.list.length == this.pageSize ? ++pagenum : pagenum; } else { this.brandByList = []; } }) }, // 跳转商品 jumpgoods(item){ uni.navigateTo({ url:'../../pages/goods/goods-list/goods-list?id=3'+'&goodsId='+this.desId+'&brandId='+item }) } } } </script> <style lang="scss"> .title-split { margin: 30rpx 0 28rpx 0; display: flex; align-items: center; justify-content: center; text { color: #161616; font-weight: 500; font-size: 30rpx; padding: 0 24rpx; } view { width: 140rpx; height: 4rpx; border-radius: 3rpx; &:first-of-type { background: linear-gradient(90deg, rgba(98, 98, 98, 0) 0%, #333333 100%); } &:last-of-type { background: linear-gradient(90deg, #333333 0%, rgba(98, 98, 98, 0) 100%); } } } .preimg { width: 120px; height: 80px; } </style>