1/fore-end/pages/home/home.wxml

<!--pages/home/home.wxml-->
<!-- 头部 -->
<view class="head">
    <view bind:tap="userTo">
        <!-- 头像 -->
        <view class="head-portrait-bg">
            <van-image width="100rpx" height="100rpx" fit="cover" src="{{avatarUrl}}" radius="20rpx"></van-image>
        </view>
        <!-- 昵称 -->
        <view class="username">{{nickName}}</view>
    </view>
    <!-- 消息提示 -->
    <view>
        <van-icon name="bell" custom-style="margin" class="head_bell" size="50rpx" info="9" color="var(--themeColor)"/>
    </view>
</view>
<!-- 搜索框 -->
<view class="search_box {{scrollTop > 85 ? 'addClass' : ''}}">
    <input type="search" name="" placeholder="搜索..." class="search_text" bind:tap="searchTo"/>
    <button class="search_button" plain="true">
        <van-icon class="search_icon" name="search" size="50rpx"/>
    </button>
</view>

<!-- 分类展示 -->
<view class="categories">
    <!-- categories -->
    <view style="position: relative;">
        <view class="text">分类</view>
        <view class="color_block categories_block "></view>
    </view>
    <!-- 点击前往分类页面 -->
    <view class="text_small" bind:tap="classifyTo">更多分类</view>
</view>

 <!-- 分类推荐 -->
<scroll-view scroll-x style='display: flex;white-space:nowrap; margin-top: 80rpx;'>
    <view class="categories_card" wx:for="{{classifyList}}" wx:for-item="item" wx:key="index">
        <view bind:tap="detailClassifyTo" data-num='{{item.Id}}'>
            <van-image width="75" height="75" radius="20rpx" src="{{item.Pic}}" />
            <view class="name_show">{{item.Name}}</view>
        </view>
    </view>
</scroll-view>

<!-- 商品展示 -->
<view style="position: relative;">
    <view class="display_text text">推荐商品</view>
    <view class="color_block recommend_block"></view>
</view>

<!-- 商品卡片 -->
<commodity_card></commodity_card>

<van-toast id="van-toast" />