卑鄙的网站开发公司,浙江省大成建设集团有限公司网站,asp网站开发培训,如何建设一个外卖订餐平台网站一、常用组件在上一个章节中讲解了封装请求数据的模块#xff0c;在此处请求轮播图的数据1.首页轮播图数据的请求以及渲染1.1 轮播图数据的请求 pages/home/home.jsimport 2 使用组件 - 视图容器 - swiper滑块视图容器。其中只可放置swiper-item组件#xff0c;否则会导致未定…一、常用组件在上一个章节中讲解了封装请求数据的模块在此处请求轮播图的数据1.首页轮播图数据的请求以及渲染1.1 轮播图数据的请求 pages/home/home.jsimport 2 使用组件 - 视图容器 - swiper滑块视图容器。其中只可放置swiper-item组件否则会导致未定义的行为。 属性表如下在pages/home/home.wxml文件中输入如下代码查看效果!--二、自定义组件 - 产品列表1.自定义组件的布局components/prolist/prolist.wxml2.自定义组件的样式components/prolist/prolist.wxss/* components/prolist/prolist.wxss */
3.首页请求数据并且传递给子组件pages/home/home.jsimport pages/home/home.wxml4.子组件接收数据components/prolist/prolist.jsComponent5.子组件渲染数据components/prolist/prolist.wxml三、实现下拉刷新上拉加载1.开启首页的下拉刷新功能pages/home/home.json{2.完善相关的下拉刷新函数pages/home/home.js// pages/home/home.js
上拉下拉测试即可四、返回顶部功能实现在首页中设置一个固定定位的按钮然后绑定点击事件绑定事件使用 bindtap然后调用小程序提供的api即可返回// pages/home/home.wxml
五、实现点击商品列表进入产品的详情页面1.构建详情页面app.jsonpages2.声明式导航跳转使用小程序 组件-导航-navigator页面链接。open-type 的合法值 -- 在编程式导航中详细讲解// components/prolist/prolist.wxml
3.详情页面接收数据并且渲染数据// pages/detail/detail.js
点击不同的产品测试即可4.编程式导航渲染使用小程序提供的api实现编程式路由的跳转wx.switchTab(Object object)跳转到 tabBar 页面并关闭其他所有非 tabBar 页面wx.reLaunch(Object object)关闭所有页面打开到应用内的某个页面wx.redirectTo(Object object)关闭当前页面跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面wx.navigateTo(Object object)保留当前页面跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层wx.navigateBack(Object object)关闭当前页面返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈决定需要返回几层小程序传递数据使用 data-params形式可以在事件中根据event获取该参数// components/prolist/prolist.wxml
千锋HTML5学院微信小程序学习笔记二-- 开发之框架zhuanlan.zhihu.com千锋HTML5学院微信小程序学习笔记四-- 常用的组件地图之-mapzhuanlan.zhihu.com
