fish_app/src/pages/indexSub/highCommission/index.jsx

import { Component } from "react";
import { View, Image } from "@tarojs/components";
import "./index.less";
import seckillImg from "../../../images/seckill/heighTop.jpg";
import ProductList from "../../../components/index/ProductList";
import { getRecommendProductList } from "../../../service";
import { getShareContent } from "../../../common/share";
export default class Index extends Component {
  state = {
    productList: [], //推荐商品列表
    page: 1, //页数
    loading: false, //加载状态
    totalPages: 1, // 添加总页数
  };
  componentDidMount() {
    this.getRecommendProductList();
  }
  // 获取推荐商品列表
  getRecommendProductList = async () => {
    const { page } = this.state;
    this.setState({ loading: true });

    const res = await getRecommendProductList({
      tag_id: 121,
      page,
      page_size: 10,
    });

    this.setState((prevState) => ({
      productList: [...prevState.productList, ...res.goods_list],
      totalPages: res.total_pages,
      loading: false,
    }));
  };
  // 配置分享内容
  onShareAppMessage() {
    return getShareContent();
  }
  // 页面上拉触底
  onReachBottom = () => {
    const { page, totalPages, loading } = this.state;
    if (page < totalPages && !loading) {
      this.setState(
        (prevState) => ({ page: prevState.page + 1 }),
        () => this.getRecommendProductList()
      );
    }
  };
  render() {
    return (
      <View className="index">
        <Image className="seckill" src={seckillImg} mode="aspectFill" />
        {/* 商品列表 */}
        <View className="product-list">
          <ProductList
            isHighCommission={true}
            productList={this.state.productList}
            loading={this.state.loading}
          />
        </View>
      </View>
    );
  }
}