网站顶部下拉广告代码,h5小程序,上海徐汇网站建设,在线直播flex-wrap属性#xff1a; 默认情况下#xff0c;项目都排在一条线#xff08;又称“轴线”#xff09;上。flex- wrap属性定义#xff0c;如果一条轴线 排不下#xff0c;如何换行#xff1f; flex-wrap:wrap 该样式用于设置 换行。 .product_name{white-space: nowrap… flex-wrap属性 默认情况下项目都排在一条线又称“轴线”上。flex- wrap属性定义如果一条轴线 排不下如何换行 flex-wrap:wrap 该样式用于设置 换行。 .product_name{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}view
!-- 搜索框开始 --SearchBar/SearchBar
!-- 搜索框结束 --!-- 轮播图开始 --
view classindex_swiperswiper autoplay circular indicator-dotsswiper-item wx:for{{swiperList}}wx:for-itemswiperwx:keyidnavigatorimage modewidthFix src{{http://localhost:8080/image/swiper/swiper.swiperPic}}/image/navigator/swiper-item/swiper
/view
!-- 轮播图结束 --!-- 商品大类显示 开始 --
view classindex_bigTypeview classbigTypeRownavigatorwx:for{{bigTypeList_row1}}wx:for-itembigTypewx:keyidimage modewidthFix src{{baseUrl/image/bigType/bigType.image}}/image/navigator/viewview classbigTypeRownavigatorwx:for{{bigTypeList_row2}}wx:for-itembigTypewx:keyidimage modewidthFix src{{baseUrl/image/bigType/bigType.image}}/image/navigator/view
/view
!-- 商品大类显示结束 --!-- 商品热卖推荐 开始 --
view classindex_hotProductview classproduct_title热卖推荐/viewview classproduct_listview classproduct_detailwx:for{{hotProductList}}wx:for-itemhotProductwx:keyidnavigatorimage modewidthFix src{{baseUrl/image/product/hotProduct.proPic}}/imageview classproduct_name{{hotProduct.name}}/viewview classproduct_price{{hotProduct.price}}/viewbutton sizemini typewarn立即购买/button/navigator/view/view
/view
!-- 商品热卖推荐 结束 --
/view.index_swiper{swiper{width: 750rpx;height: 375rpx;swiper-item{image{width: 100%;}}}
}.index_bigType{padding-top: 20rpx;background-color: #F7F7F7;.bigTypeRow{display: flex;navigator{flex:1;image{width: 150rpx;}}}
}.index_hotProduct{.product_title{font-size: 32rpx;font-weight: 600;padding: 20rpx;color: var(--themeColor);background-color: #E0E0E0;}.product_list{display: flex;flex-wrap: wrap;.product_detail{margin: 15rpx;width: 46%;text-align: center;navigator{image{width: 100%;background-color: #F5F5F5;}.product_name{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}.product_price{color: var(--themeColor);}button{}}}}
}import { requestUtil,getBaseUrl } from ../../utils/requestUtilPage({/*** 页面的初始数据*/data: {//轮播图数组swiperList:[],baseUrl:,bigTypeList:[],bigTypeList_row1:[],bigTypeList_row2:[],hotProductList:[]},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {const baseUrl getBaseUrl();this.setData({baseUrl})this.getSwiperList();this.getBigTypeList();this.getHotProductList();},async getSwiperList(){const resultawait requestUtil({url:/product/findSwiper,method:GET});this.setData({swiperList:result.message})},async getBigTypeList(){const result await requestUtil({url:/bigType/findAll,method:GET});console.log(result)const bigTypeListresult.messageconst bigTypeList_row1bigTypeList.filter((item,index){return index5;})const bigTypeList_row2bigTypeList.filter((item,index){return index5;})this.setData({bigTypeList,bigTypeList_row1,bigTypeList_row2})},/*** 获取热卖商品*/async getHotProductList(){const resultawait requestUtil({url:/product/findHot,method:GET});this.setData({hotProductList: result.message})},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})
