无知的我正在复盘微信小程序

下图是我总结的 uniapp 思维导图，后续会不断补充

文章目录

微信小程序
项目框架
- 项目目录图解
- app.json
- 具体看官方文档
配置全局
初始化文件
- 清空文件内容
- 全局配置
- 所有页面内边距
导航栏
- 编写代码
- 运行效果
轮播图
- 编写代码
- 运行效果
课程分类
- 编写代码
- 运行效果
学生作品
- 编写代码
- 运行效果
行业动态
- 编写代码
- 运行效果
尾部模块
底部导航栏
- 编写代码
- 运行效果
课程分类内页
- HTML
- CSS
- 运行效果
- 跳转功能
传递组件数据
- 配置组件
- - 配置组件页面
  - 定义Vue属性
- 配置HTML页面
- - 绑定组件
  - 为组件属性赋值
调用数据接口
- 请求数据
- 载入数据
- 运行效果
ES6封装方法
- utils\public.js
- index.js

微信小程序

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-2qtltB6i-1671343240236)(微信小程序.assets/image-20220211210121704.png)]

项目框架

项目目录图解

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-42K4LUlj-1671343240237)(微信小程序.assets/基本的项目目录图例.png)]

以app开头的文件是应用程序级别的文件,更改一处全局生效。而页面pages的配置优先级高于全局配置(就近原则)
小程序是允许你修改文件目录名的
不可在同一文件同时写html和css

app.json

{"pages":[ // 可自动创建小程序页面项目"pages/index/index", // 小程序显示的页面；注意-不可写文件后缀"pages/logs/logs" // 若放在前一行，则该页面是小程序显示的页面],"window":{ // 全局的默认窗口表现"backgroundTextStyle":"light","navigationBarBackgroundColor": "#fff","navigationBarTitleText": "Weixin","navigationBarTextStyle":"black"},"style": "v2","sitemapLocation": "sitemap.json"
}

具体看官方文档

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-HVnVdKZ8-1671343240238)(微信小程序.assets/image-20220129130159484.png)]

配置全局

{"pages":["pages/index/index","pages/logs/logs"],"window":{"backgroundTextStyle":"light","navigationBarTitleText": "新视觉实训","navigationBarTextStyle":"white"},"style": "v2","sitemapLocation": "sitemap.json"
}

// @style 版本号

初始化文件

清空文件内容

清空index的所有文件内容；其中对index.js 使用page 关键字生成基本框架
清空app样式文件内容

全局配置

app.json

{"pages":["pages/index/index","pages/logs/logs"],"window":{"backgroundTextStyle":"light","navigationBarTitleText": "新视觉实训","navigationBarTextStyle":"white"},"style": "v2","sitemapLocation": "sitemap.json"
}

所有页面内边距

app.wxss

.container{ padding: 0 26rpx; box-sizing: border-box;}

导航栏

编写代码

index.wxml

<view class="header">
<!-- 1 导航栏 --><view class="container hdCon"><!-- 新视觉图标跳转 --><navigator class="logo" open-type="switchTab" url="/pages/index/index"><image mode="heightFix" src="/images/logo.png"></image><!--@open-type 启动导航栏跳转 @url 跳转到的页面  @heightFix 宽度自适应--></navigator><!-- 客服图标跳转 --><view class="kefu"><button class="btn" open-type="contact"></button><!--@open-type 打开客服服务 --><image mode="heightFix" src="/images/xiaoxi.png"></image></view></view>
</view>

index.wxss

.header{ width: 750rpx; height: 90rpx; border: 1px solid red;}
.hdCon{ display: flex; justify-content: space-between; align-items: center; height: 100%;}
/* @内容两端对齐；内容居中对齐，若要垂直居中，需要指定高度(高度不继承父元素) */
.hdCon navigator, .hdCon .kefu{ height: 50rpx;}
.hdCon image{ height: 100%;}
.kefu{ position: relative; animation: dh linear 1s infinite alternate;}
/* @设置名为dh的动画，匀速，每1秒，重复，逆序 */
.kefu .btn{ position: absolute; width: 100%; height: 100px; top: 0; left: 0; opacity: 0;}
/* @透明度为0 */

app.wxss

@keyframes dh{0%,50%,100%{opacity: 1;}25%{opacity: 0;}
}
/* 配置名为dh的动画，当...透明度为1，当...透明度为0 */

运行效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-7u2D18ZG-1671343240238)(微信小程序.assets/image-20220129142138160.png)]

客服图标闪烁显示方法-利用button标签绝对定位

轮播图

编写代码

html

<view class="banner"><swiper indicator-dots indicator-color="rgb(255,255,255,.5)" indicator-active-color="#fff" circular autoplay interval="4000"><!-- @开启小点；小点颜色；被选中的颜色；衔接播放；自动播放；每4秒播放 --><swiper-item><image src="/images/banner1.jpg"/></swiper-item><swiper-item><image src="/images/banner2.jpg"/></swiper-item><swiper-item><image src="/images/banner3.jpg"/></swiper-item></swiper>
</view>

css

/*2 banner 轮播图 */
.banner{height: 295rpx; width: 100%; border: 1px solid green;}
.banner swiper{height: 100%; width: 100%;}
.banner swiper image{height: 100%; width: 100%;}

运行效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-DdmtZSKl-1671343240239)(微信小程序.assets/image-20220129143812915.png)]

课程分类

编写代码

HTML

<!-- 3 课程分类 -->
<scroll-view class="major" scroll-x>
<!-- @scroll-x 横向滚动 --><navigator class="box" url=""><image class="pic" src="/images/kecheng1.png"></image><view class="text">平面设计</view></navigator><navigator class="box" url=""><image class="pic" src="/images/kecheng2.png"></image><view class="text">平面设计</view></navigator><navigator class="box" url=""><image class="pic" src="/images/kecheng3.png"></image><view class="text">平面设计</view></navigator><navigator class="box" url=""><image class="pic" src="/images/kecheng4.png"></image><view class="text">平面设计</view></navigator><navigator class="box" url=""><image class="pic" src="/images/kecheng5.png"></image><view class="text">平面设计</view></navigator>
</scroll-view>

CSS

/*3 课程分类 */
.major{ white-space: nowrap; padding: 20rpx 0;}
.major .box {display: inline-block; text-align: center; width: 165rpx;}
.major .pic{width: 100rpx; height: 100rpx;}
.major .text{ font-size: 26rpx; margin-top: 10rpx;}

运行效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-UH08R27L-1671343240240)(微信小程序.assets/image-20220129152013959.png)]

学生作品

编写代码

HTML

<!-- 4 学生作品 -->
<view class="works"><view class="container"><view class="pubTitle"><view class="txt">学生作品</view><navigator class="more">更多></navigator></view><view class="wkMain"><navigator class="box"><image class="pic" src="/images/xszp1.jpg"></image><view class="ceng"><view class="tit">UI设计作品</view><view class="line"></view><view class="des">UI design works</view></view></navigator><navigator class="box"><image class="pic" src="/images/xszp2.jpg"></image><view class="ceng"><view class="tit">UI设计作品</view><view class="line"></view><view class="des">UI design works</view></view></navigator><navigator class="box"><image class="pic" src="/images/xszp3.jpg"></image><view class="ceng"><view class="tit">UI设计作品</view><view class="line"></view><view class="des">UI design works</view></view></navigator><navigator class="box"><image class="pic" src="/images/xszp4.jpg"></image><view class="ceng"><view class="tit">UI设计作品</view><view class="line"></view><view class="des">UI design works</view></view></navigator><navigator class="box"><image class="pic" src="/images/xszp5.jpg"></image><view class="ceng"><view class="tit">UI设计作品</view><view class="line"></view><view class="des">UI design works</view></view></navigator><navigator class="box"><image class="pic" src="/images/xszp6.jpg"></image><view class="ceng"><view class="tit">UI设计作品</view><view class="line"></view><view class="des">UI design works</view></view></navigator><navigator class="box"><image class="pic" src="/images/xszp7.jpg"></image><view class="ceng"><view class="tit">WEB设计作品</view><view class="line"></view><view class="des">WEB FRONT END WORKS</view></view></navigator><navigator class="box"><image class="pic" src="/images/xszp8.jpg"></image><view class="ceng"><view class="tit">UI设计作品</view><view class="line"></view><view class="des">UI design works</view></view></navigator></view></view>
</view>

CSS

/*4 学生作品模块 */
.works{ background: #f0f3f8; padding: 90rpx 0 70rpx;}
.wkMain{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.wkMain .box{ width: 344rpx; height: 214rpx; margin-bottom: 10rpx; position: relative;}
.wkMain .pic{ width: 100%; height: 100%;}
.wkMain .ceng{display: flex; width: 100%; height: 100%; background: rgb(0, 0, 0,0.5); position: absolute; top: 0; left: 0; color: #fff; flex-direction: column; justify-content: center; align-items: center; padding: 0 20rpx; box-sizing: border-box; text-align: center;}
/*@text-align 内部元素文字居中 align-items 元素居中 *//*@box-sizing 解决外边距圹大问题  */
.wkMain .ceng .tit{ font-size: 34rpx;}
.wkMain .ceng .line{ width: 50rpx; height: 2rpx; background-color: #fff; margin: 10rpx 0 20rpx; }
.wkMain .ceng .des{ opacity: 0.6; text-transform: uppercase; font-size: 26rpx; letter-spacing: 5rpx;}

运行效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-iqRgvV6F-1671343240241)(微信小程序.assets/image-20220129202146579.png)]

行业动态

编写代码

HTML

<!-- 5 行业 -->
<view class="dynamic"><view class="container"><view class="pubTitle"><view class="txt">行业动态</view><view class="more">更多></view></view><view class="dyMain"><navigator class="dyItem" wx:for="{{8}}"><view class="pic"><image src="/images/xszp1.jpg"></image></view><view class="txt"><view class="title">这是标题</view><view class="info">作者：无知的人<text space="ensp"> - </text>时间：2022</view></view></navigator></view></view>
</view>

CSS

/*5 行业动态 */
.dynamic{ padding: 90rpx 0 70rpx; }
.dyItem{ display: flex; padding:15rpx 0;border:1rpx dashed #f4f4f4; justify-content: space-between;}
.dyItem .pic{width:230rpx; height: 150rpx;}
.dyItem .pic image{ width:100%; height: 100%;}
.dyItem .txt{width:440rpx; display: flex; flex-direction:column; justify-content: space-between;}
.dyItem .title{ font-size: 34rpx;}
.dyItem .info{ font-size: 26rpx; color:#888}
.dyItem .info text{font-size:22rpx;}

运行效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-joHTptKN-1671343240242)(微信小程序.assets/image-20220129220841598.png)]

尾部模块

HTML

<!-- 6 尾部 -->
<view class="footer"><image class="pic" src="/images/logo.png" mode="widthFix"></image><view class="text">- 高端实训品牌</view>
</view>

CSS

/* 6 尾部 */
.footer{ padding: 50rpx 0; background: #f2f2f2; text-align: center;}
.footer .pic{ width: 180rpx;}
.footer .text{ font-size: 25rpx; color: #666;}

底部导航栏

编写代码

app.json

{"pages":["pages/index/index","pages/logs/logs","pages/works/works","pages/dynamic/dynamic","pages/ps/ps","pages/show/show"],"window":{        "navigationBarTitleText": "新视觉实训","navigationBarTextStyle":"white"},"tabBar":{"color":"#B6B6B6","selectedColor":"#FE9132","list":[{"pagePath":"pages/index/index","text":"首页","iconPath":"images/home.png","selectedIconPath":"images/home-h.png"},{"pagePath":"pages/works/works","text":"作品","iconPath":"images/user.png","selectedIconPath":"images/user-h.png"},{"pagePath":"pages/dynamic/dynamic","text":"动态","iconPath":"images/list.png","selectedIconPath":"images/list-h.png"}]},"style": "v2","sitemapLocation": "sitemap.json"
}

运行效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-UfT89t4N-1671343240242)(微信小程序.assets/image-20220129220702064.png)]

课程分类内页

元素选择器
虚线边框

HTML

<view class="header">
<!-- 1 导航栏 --><view class="container hdCon"><!-- 新视觉图标跳转 --><navigator class="logo" open-type="switchTab" url="/pages/index/index"><image mode="heightFix" src="/images/logo.png"></image><!--@open-type 启动导航栏跳转 @url 跳转到的页面  @heightFix 宽度自适应--></navigator><!-- 客服图标跳转 --><view class="kefu"><button class="btn" open-type="contact"></button><!--@open-type 打开客服服务 --><image mode="heightFix" src="/images/xiaoxi.png"></image></view></view>
</view><view class="banner"><image src="/images/psbanner.jpg1 (1).jpg" mode="widthFix"></image>
</view><view class="psBox"><view class="psBoxTit">专业转件技能</view><view class="psBoxConOne"><view class="item"><image src="/images/photoshop.png1.png"></image><view>photoshop</view></view><view class="item"><image src="/images/photoshop.png1.png"></image><view>photoshop</view></view><view class="item"><image src="/images/photoshop.png1.png"></image><view>photoshop</view></view><view class="item"><image src="/images/photoshop.png1.png"></image><view>photoshop</view></view><view class="item"><image src="/images/photoshop.png1.png"></image><view>photoshop</view></view>      </view>
</view><view class="psBox"><view class="psBoxTit">专业转件技能</view><view class="psBoxCon"><image src="/images/psmajor02.jpg2.jpg" mode="widthFix" class="pic"></image><view class="text">        <view>人像精修</view><view>商业广告片调色</view><view>商业海报级视觉精修</view><view>卡通人物制作</view><view>2.5D插画制作</view><view>3D文字视觉特效制作</view><view>平面广告创意</view><view>合成特效制作</view>        </view></view>
</view><view class="psBox"><view class="psBoxTit">专业转件技能</view><view class="psBoxCon"><image src="/images/psmajor02.jpg2.jpg" mode="widthFix" class="pic"></image><view class="text">        <view>人像精修</view><view>商业广告片调色</view><view>商业海报级视觉精修</view><view>卡通人物制作</view><view>2.5D插画制作</view><view>3D文字视觉特效制作</view><view>平面广告创意</view><view>合成特效制作</view>        </view></view>
</view><view class="psBox"><view class="psBoxTit">专业转件技能</view><view class="psBoxCon"><image src="/images/psmajor02.jpg2.jpg" mode="widthFix" class="pic"></image><view class="text">        <view>人像精修</view><view>商业广告片调色</view><view>商业海报级视觉精修</view><view>卡通人物制作</view><view>2.5D插画制作</view><view>3D文字视觉特效制作</view><view>平面广告创意</view><view>合成特效制作</view>        </view></view>
</view><view class="psBox"><view class="psBoxTit">专业转件技能</view><view class="psBoxCon"><image src="/images/psmajor02.jpg2.jpg" mode="widthFix" class="pic"></image><view class="text">        <view>人像精修</view><view>商业广告片调色</view><view>商业海报级视觉精修</view><view>卡通人物制作</view><view>2.5D插画制作</view><view>3D文字视觉特效制作</view><view>平面广告创意</view><view>合成特效制作</view>        </view></view>
</view><view class="psBox"><view class="psBoxTit">专业转件技能</view><view class="psBoxCon"><image src="/images/psmajor02.jpg2.jpg" mode="widthFix" class="pic"></image><view class="text">        <view>人像精修</view><view>商业广告片调色</view><view>商业海报级视觉精修</view><view>卡通人物制作</view><view>2.5D插画制作</view><view>3D文字视觉特效制作</view><view>平面广告创意</view><view>合成特效制作</view>        </view></view>
</view>

CSS

.header{ width: 750rpx; height: 90rpx; border: 1px solid red;}
.hdCon{ display: flex; justify-content: space-between; align-items: center; height: 100%;}
/* @内容两端对齐；内容居中对齐，若要垂直居中，需要指定高度(高度不继承父元素) */
.hdCon navigator, .hdCon .kefu{ height: 50rpx;}
.hdCon image{ height: 100%;}
.kefu{ position: relative; animation: dh linear 1s infinite alternate;}
/* @设置名为dh的动画，匀速，每1秒，重复，逆序 */
.kefu .btn{ position: absolute; width: 100%; height: 100px; top: 0; left: 0; opacity: 0;}
/* @透明度为0 */.banner{ width:100%}
.banner image{ width:750rpx; display: block; }.psBox{ padding:80rpx 0; background:#1C356E}
.psBox:nth-child(2n){ background:#fff;}/* 圆角边框 */
.psBoxTit{ width:490rpx; height: 70rpx; background: #DE2E05; border-radius: 70rpx; color:#fff; text-align: center; line-height: 70rpx;margin:0 auto; font-size:40rpx;  position: relative;margin-bottom: 40rpx;}
.psBoxTit::before{ display: block; content: ""; width:100%; height: 100%; border:2px dotted #DE2E05; position: absolute; top:0; left: 0;box-sizing: border-box; border-radius: 70rpx; transform: scale(1.03,1.2);}/* 大图以及小圆点 */
.psBoxCon .pic{ width:100%; }
.psBoxCon .text{ padding:40rpx 26rpx 0; box-sizing: border-box; display: flex; flex-wrap: wrap;}
.psBoxCon .text view{width:50%; font-size:30rpx; line-height: 1.8em;position: relative; padding-left:18rpx; box-sizing: border-box;}
.psBoxCon .text view::before{ content: ""; display: block;width:10rpx; height: 10rpx; border-radius: 50%; background:#000; position: absolute; left:0; top:50%; margin-top:-5rpx;}
.psBox:nth-child(2n-1) .psBoxCon .text{ color:#fff;}
.psBox:nth-child(2n-1) .text view::before{ background:#fff}/* 圆形图标 */
.psBoxConOne{ color:#fff; display: flex; flex-wrap: wrap; justify-content: center;}
.psBoxConOne .item{ text-align: center; padding:20rpx;}
.psBoxConOne image{width:180rpx; height: 180rpx;}
.psBoxConOne .item view{ text-transform: uppercase;font-size: 28rpx; padding-top:5rpx;}/* 6 尾部 */
.footer{ padding: 50rpx 0; background: #f2f2f2; text-align: center;}
.footer .pic{ width: 180rpx;}
.footer .text{ font-size: 25rpx; color: #666;}

运行效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-x9GuNjgR-1671343240243)(微信小程序.assets/image-20220129233851075.png)]

跳转功能

<!-- 3 课程分类 -->
<scroll-view class="major" scroll-x>
<!-- @scroll-x 横向滚动 --><navigator open-type="navigate" class="box" url="/pages/ps/ps"><image class="pic" src="/images/kecheng1.png"></image><view class="text">平面设计</view></navigator><!--@navigate 这是默认值，可以省略 --><navigator open-type="switchTab" class="box" url="/pages/works/works"><!--@switchTab 当跳转到底部导航栏页面需要 --><image class="pic" src="/images/kecheng2.png"></image><view class="text">平面设计</view></navigator>

传递组件数据

配置组件

配置组件页面

HTML

<view class="pubTitle"><view class="txt">{{myTitle}}</view><navigator open-type="reLaunch" url="{{myUrl}}" class="more">更多 ></navigator>   <!--reLaunch 跳转到导航页面  -->
</view>

CSS

.pubTitle{ display: flex; justify-content: space-between;height: 60rpx;  align-items: center; margin-bottom:40rpx;}
.pubTitle .txt{ font-size:40rpx; height: 100%; position: relative; padding-left:20rpx;}
.pubTitle .txt::before{ display: block; width:8rpx; height: 34rpx; background: #c8020b; content: ""; position: absolute; left: 0; top:50%; margin-top:-15rpx;}
.pubTitle .more{ font-size:34rpx; color:#666}

定义Vue属性

// components/PubTitle/PubTitle.js
Component({/*** 组件的属性列表*/properties: {myTitle:{type:String,value:""},myUrl:{type:String,value:""}},/*** 组件的初始数据*/data: {},/*** 组件的方法列表*/methods: {}
})

配置HTML页面

绑定组件

{"usingComponents": {"HdView":"/components/HdView/HdView","FtView":"/components/FtView/FtView","PubTitle":"/components/PubTitle/PubTitle"}
}

为组件属性赋值

有略…

<PubTitle myTitle="学生作品" myUrl="/pages/works/works"/>
<PubTitle myTitle="行业动态" myUrl="/pages/ps/ps"/>

调用数据接口

请求数据

Page({/*** 页面的初始数据*/data: {dataList:[]},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {    wx.request({url: 'https://ku.qingnian8.com/school/list.php',success:res=>{ res.data.forEach(item=>{// 毫秒化秒var time = item.posttime*1000;var d = new Date(time);var year = d.getFullYear();var month = (d.getMonth() + 1 < 10 ? "0" + (d.getMonth() + 1) : (d.getMonth() + 1));var day = d.getDate();var posttime = year + "-" + month + "-" +day;item.posttime = posttime;}),this.setData({dataList:res.data}) }})},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

载入数据

<!-- 5 行业 -->
<view class="dynamic"><view class="container"><PubTitle myTitle="行业动态" myUrl="/pages/ps/ps"/><view class="dyMain" ><navigator class="dyItem" wx:for="{{dataList}}"><view class="pic"><image src="{{item.picurl}}"></image></view><view class="txt"><view class="title">{{item.title}}</view><view class="info"><text>作者：</text>{{item.author}}<text space="ensp"> - </text>时间：{{item.posttime}}</view></view></navigator></view></view>
</view>

运行效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-92y8Bhbq-1671343240243)(微信小程序.assets/image-20220130221619295.png)]

ES6封装方法

utils\public.js

var common={getStrLen:function(str,len){if(str.length>len){return str.substr(0,len)+"..."}else{return str}},getMyData:function (timestamp, formats) {// formats格式包括// 1. Y-m-d// 2. Y-m-d H:i:s// 3. Y年m月d日// 4. Y年m月d日 H时i分formats = formats || 'Y-m-d';var zero = function (value) {if (value < 10) {return '0' + value;}return value;};var timestamp=timestamp*1000;var myDate = timestamp? new Date(timestamp): new Date();var year = myDate.getFullYear();var month = zero(myDate.getMonth() + 1);var day = zero(myDate.getDate());var hour = zero(myDate.getHours());var minite = zero(myDate.getMinutes());var second = zero(myDate.getSeconds());return formats.replace(/Y|m|d|H|i|s/ig, function (matches) {return ({Y: year,m: month,d: day,H: hour,i: minite,s: second})[matches];});}}module.exports=common

index.js

import common from "../../utils/public.js";Page({/*** 页面的初始数据*/data: {dataList:[]},//发送网络请求获取真实的行业动态列表getRequest(){wx.request({url: 'https://ku.qingnian8.com/school/list.php',data:{num:5        },success:res=>{ res.data.forEach(item=>{item.posttime=common.getMyData(item.posttime,"Y-m-d")item.title=common.getStrLen(item.title,25)})  this.setData({dataList:res.data}) }})},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {    this.getRequest();},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})