微信小程序商品列表代码

以下是微信小程序商品列表的示例代码：

<!-- 商品列表页面 -->
<view class="container">
<view class="search-bar">
<!-- 搜索框 -->
</view>
<scroll-view class="goods-list" scroll-y="true">
<!-- 商品列表 -->
<view class="goods-item" wx:for="{{goodsList}}" wx:key="index">
<view class="goods-img">
<!-- 商品图片 -->
<image src="{{item.imgUrl}}" mode="aspectFill"></image>
</view>
<view class="goods-info">
<!-- 商品信息 -->
<view class="goods-name">{{item.name}}</view>
<view class="goods-price">¥{{item.price}}</view>
<button class="add-cart-btn" bindtap="addCart" data-id="{{item.id}}">加入购物车</button>
</view>
</view>
</scroll-view>
</view>

// 商品列表页面的js代码
Page({
data: {
goodsList: [
{
id: 1,
name: "商品名称1",
price: "99.00",
imgUrl: "https://example.com/img1.jpg"
},
{
id: 2,
name: "商品名称2",
price: "199.00",
imgUrl: "https://example.com/img2.jpg"
},
// ...更多商品数据
]
},

// 添加购物车
addCart: function(e) {
const id = e.currentTarget.dataset.id;
console.log("添加购物车，商品id为：" + id);
// ...处理添加购物车的逻辑
}
})