小程序项目--电商优购day03

商品列表⻚⾯

效果

业务逻辑

1.加载商品列表数据
2.启⽤下拉⻚⾯功能
1.⻚⾯的json⽂件中开启设置 enablePullDownRefresh:true enablePullDownRefresh:true
2.⻚⾯的js中，绑定事件 onPullDownRefresh
3.启⽤上拉⻚⾯功能 onReachBottom onReachBottom ⻚⾯触底事件
4.加载下⼀⻚功能

接口

商品列表搜索

https://api-hmugo-web.itheima.net/api/public/v1/goods/search

1.wxml文件代码

<!-- 搜索框 -->
<search-input></search-input>
<!-- tabs栏 -->
<tabs tabs="{
   {tabs}}" bind:tabsItemChange="handletabsItemChange">
	<block wx:if="{
   {tabs[0].isActive}}">
		<view class="first_tab">
			<navigator
			 class="goods_item"
			 wx:for="{
   {goodsList}}"
			 wx:key="goods_id"
			 url="/pages/goods_detail/index?goods_id={
   {item.goods_id}}"
			>
				<!-- 左侧图片容器 -->
				<view class="goods_img">
					<image mode="widthFix" src="{
   {item.goods_small_logo ?item.goods_small_logo:'http://image1.suning.cn/uimg/b2c/newcatentries/0070134290-000000000149003877_1_400x400.jpg' }}" />
				</view>
				<!-- 右侧商品容器 -->
				<view class="goods_info">