小程序API与生命周期总结

小程序生命周期

onLaunch 启动
（本地存储，登录）
onShow前台展示
开始播放与运行
onHide后台运行
（停止播放与运行）
onError发生错误
（监听处理错误）

页面的生命周期

生命周期
	onLoad 加载完毕
（获取页面传参，初始化，网络请求，本地出错）
	onReady首次渲染完毕
（获取节点）
	onShow前台显示
	onHIde后台运行
	onUnload 页面被卸载
	固定回调函数
	onPullDownRefresh 下拉属性
		在json中配置
enablePullDownRefresh
		停止下拉刷新
wx.stopPullDownRefresh()
	onReachBottom 上拉触底
	onShareAppMessage 右上角分享
	 onShareTimeline 分享到朋友圈
	onPageScroll 页面滚动
		e.scrollTop
页面滚动的距离
		 wx.pageScrollTo({
  duration: 600,
  scrollTop:0,
})
//将页面滚动到指定的位置
//也可以指定滚动到指定的元素
	onTabItemTap 页面底部栏被点击 

微信小程序API

1.基础
wx.getSystemInfoSync() 同步获取系统信息
var sys = wx.getSystemInfoSync();
console.log(sys);

2.网络
wx.request（）网络请求
wx.downloadFile 下载文件
wx.saveImageToPhotosAlbum 保存图片到相册
wx.uploadFile 下载
wx.chooseMedia 选择图片或者视频
wx.chooseImage 从相册选择图片
<image src="{{pic}}" mode="aspectFill" bindtap="downPic"></image>
<button type="warn" bindtap="upImg">上传图片</button>

downPic(){
    wx.downloadFile({
      url: this.data.pic,
      success(res){
        console.log(res);
        // 把临时文件保存到相册(需要用户授权)
        wx.saveImageToPhotosAlbum({
          filePath: res.tempFilePath,
          success(){
            // 提示保存成功
            wx.showToast({
              title: '下载图片成功',
              icon:"none"
            })
          }
        })
      }
    })
  },

upImg(){
    var that  =  this;
    // 选择图片
    // wx.chooseImage({
    // 选择媒体
    wx.chooseMedia({
      count: 1, //媒体数量
      success(res){
        console.log(res)
        // 获取选择的第0个图片临时地址
        var tempFile = res.tempFiles[0].tempFilePath;
        wx.uploadFile({
          filePath: tempFile,
          name: 'file',
          url: 'http://dida100.com/ajax/file.php',
          success:res=>{
            console.log(res);
            // 转换为js对象
            var data = JSON.parse(res.data);
            // 更新图片信息
            that.setData({pic:"http://dida100.com"+data.pic})
          }
        })
      }
    })
  },

3.界面
wx.showModal 模特框
wx.showToast 提示
wx.showLoading 加载提示
wx.setNavigationBarTitle 标题栏文本
wx.setNavigationBarColor 设置导航栏的颜色
<button size="mini" bindtap="showTip">提示</button>

showTip(){
    wx.setNavigationBarTitle({
      title: 'api讲解',
    })
    wx.setNavigationBarColor({
      frontColor: '#ffffff',
      backgroundColor: '#ff0000',
      animation: {
        duration: 400,
        timingFunc: 'easeIn'
      }
    })
     wx.showModal({
      title:"需要观看广告才能解锁",
     content:"每天试用2次"
    })
     wx.showToast({
       title: '你好！',
      icon:"none"
     })
    wx.showLoading({
      title: '加载中...',
    })
    setTimeout(()=>{
      wx.hideLoading();
    },2000)
  },

4.开放能力
wx.getUserProfile 获取用户信息
<view wx:if="{{userInfo.nickName}}">
<image style="width: 100px; height: 100px;" src="{{userInfo.avatarUrl}}"></image>
<view>{{userInfo.nickName}}</view>
</view> 
<button wx:else size="mini" bindtap="getUser">

getUser(){
    var that = this;
    wx.getUserProfile({
      desc: '需要获取您的昵称',
      success:res=>{
        console.log(res);
        // 更新本地用户信息
        that.setData({"userInfo":res.userInfo})
        // 存储用户信息到本地
        wx.setStorageSync('userInfo', res.userInfo)
      }
    })
  },

更多API功能可以到微信官方开发文档查阅
https://developers.weixin.qq.com/miniprogram/dev/api/