建筑设计案例网站推荐,版面设计网站,湛江市研发网站建设,国企央企招聘2022年目录
1、 对话框
1.1 模态对话框
1.2 消息对话框
2、 存储
2.1 同步
2.1.1 同步保存数据
2.1.2 同步获取数据
2.1.3 同步删除数据
2.1.4 同步清空数据
2.2 异步
2.2.1 异步保存数据
2.2.2 异步获取数据
2.2.3 异步删除数据
2.2.4 异步清空数据
3、 上拉加载更多…目录
1、 对话框
1.1 模态对话框
1.2 消息对话框
2、 存储
2.1 同步
2.1.1 同步保存数据
2.1.2 同步获取数据
2.1.3 同步删除数据
2.1.4 同步清空数据
2.2 异步
2.2.1 异步保存数据
2.2.2 异步获取数据
2.2.3 异步删除数据
2.2.4 异步清空数据
3、 上拉加载更多和下拉刷新
3.1 上拉加载更多onReachBottom
3.2 下拉刷新onPullDownRefresh
3.3 scroll-view实现
4、小程序更新- 生命周期
4.1 小程序强制更新
4.2 整个应用生命周期-app.js
4.3 某个页面生命周期-页面.js
5、其他
5.1 分享到朋友圈没有成功
5.2 发送给朋友
5.2.1 方式一通过右上方... 5.2.2 方式二通过按钮
5.3 获取头像
5.4 获取昵称
5.5 获取手机号
5.5.1 手机号快速验证
5.5.2 手机号实时验证
5.5.3 代码演示无法实现需要企业认证
5.6 实时客服功能 前言快速上数了再学习一些常见的方法 1、 对话框
1.1 模态对话框
wxml js 1.2 消息对话框
wxml js 2、 存储 wxml js
2.1 同步
2.1.1 同步保存数据 点击存储数据按钮 2.1.2 同步获取数据 2.1.3 同步删除数据 2.1.4 同步清空数据 2.2 异步
2.2.1 异步保存数据 2.2.2 异步获取数据
异步获取--》 函数定义成async 内部获取的时候前面写await 2.2.3 异步删除数据 2.2.4 异步清空数据 3、 上拉加载更多和下拉刷新
3.1 上拉加载更多onReachBottom
json添加距离底部多少50rpx的时候触发js里面的onReachBottom函数
{usingComponents: {},onReachBottomDistance: 50}
js /*** 页面上拉触底事件的处理函数*/onReachBottom() {console.log(触发了)},
concat拼接数组 wxss 后端 3.2 下拉刷新onPullDownRefresh
json开始下拉刷新enablePullDownRefresh
设置对应刷新背景颜色backgroundColor和样式backgroundTextStyle
{usingComponents: {},onReachBottomDistance: 50,enablePullDownRefresh: true,backgroundColor: #efdeef,backgroundTextStyle:light}
js 3.3 scroll-view实现
wxml wxss
scroll这个是必须 js 4、小程序更新- 生命周期
4.1 小程序强制更新 自己测试的话这样设置 4.2 整个应用生命周期-app.js
app.js
// app.js
App({/*** 当小程序初始化完成时会触发 onLaunch全局只触发一次*/onLaunch: function () {console.log(小程序只要启动就触发它)},/*** 当小程序启动或从后台进入前台显示会触发 onShow*/onShow: function (options) {console.log(小程序切回来了)},/*** 当小程序从前台进入后台会触发 onHide*/onHide: function () {console.log(小程序切到后台了)},/*** 当小程序发生脚本错误或者 api 调用失败时会触发 onError 并带上错误信息*/onError: function (msg) {}
})
4.3 某个页面生命周期-页面.js
// pages/demo/demo.js
Page({/*** 页面的初始数据*/data: {},/*** 生命周期函数--监听页面加载*/onLoad(options) {},/*** 生命周期函数--监听页面初次渲染完成*/onReady() {},/*** 生命周期函数--监听页面显示*/onShow() {},/*** 生命周期函数--监听页面隐藏*/onHide() {},/*** 生命周期函数--监听页面卸载*/onUnload() {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh() {},/*** 页面上拉触底事件的处理函数*/onReachBottom() {},/*** 用户点击右上角分享*/onShareAppMessage() {}
}) 5、其他
5.1 分享到朋友圈没有成功
这个注意前提必须有5.2功能 5.2 发送给朋友
5.2.1 方式一通过右上方... 5.2.2 方式二通过按钮 5.3 获取头像
wxml
open-type 必须是 chooseAvatar
view--------------获取用户头像------------/view
button classbtn open-typechooseAvatar bindchooseavatarchoosePhoto
image src{{photo}} classphoto /
/button
wxss
/* pages/demo/demo.wxss */.btn{background-color: transparent;
}
.btn::after{border: none;
}
.photo{height: 250rpx;width: 250rpx;border-radius: 50%;
}
wxjs
Page({/*** 页面的初始数据*/data: {photo: /static/images/tx.png},/*** 获取用户头像*/choosePhoto(event){console.log(event)this.setData({photo: event.detail.avatarUrl})}
}) 5.4 获取昵称
wxml
type必须是 nickname
view--------------获取用户昵称------------/view
input typenickname placeholder输入或获取昵称 model:value {{username}} /
button typeprimary plain bindtapshowName提交/button
wxss
input{border: 1rpx solid pink;border-radius: 10rpx;padding: 10rpx;margin: 10rpx;
} wxjs /*** 页面的初始数据*/data: {photo: /static/images/tx.png,username: },/*** 获取用户昵称*/showName(){console.log(this.data.username)}, 5.5 获取手机号 5.5.1 手机号快速验证 5.5.2 手机号实时验证 5.5.3 代码演示无法实现需要企业认证
wxml
view--------------获取用户手机号------------/view
button typewarn open-typegetPhoneNumber bindgetphonenumbergetPhoneNumber快速手机号/button
button typedefault plain open-typegetRealtimePhoneNumber bindgetrealtimephonenumbergetRealPhoneNumber快速手机号/button
wxjs
/*** 获取用户手机号*/getPhoneNumber(event){console.log(event.detail.code)wx.request({url: url,method:POST,data:{code: event.detail.code},header: {Content-Type: application/json},success: (res) {console.log(res) },fail: (err) {console.log(err)}})},/*** 实时获取用户手机号*/getRealPhoneNumber(event){console.log(event)}, 后台程序调用接口 5.6 实时客服功能 wxml
button typedefault plain open-typecontact联系客服/button
真机调式发送消息然后上微信小程序 后台 自动回复额外开发
