wx小程序小程序基础引入文件/组件暴露接口module.exports=A引入文件(建议使用相对路径)使用require

小程序基础

引入文件/组件

暴露接口 module.exports=A 引入文件(建议使用相对路径) 使用require('./A.js) include 引入组件 import 引入template模板使用模板

内置方法

都放在wx命名空间下，我们通过wx调用

wx.login 登录成功过后执行的方法
参数是一个对象，对象中有一个success方法
wx.getSetting 获取授权的方法
参数是一个对象对象中有一个success方法
wx.getUserInfo 获取用户信息
参数是一个对象，对象中有一个success方法

全局方法

App: 创建应用程序的方法
getApp：获取引用程序的方法
Page：创建页面的方法
getCurrentPages：获取当前页面的方法

常用事件方法

我们通过生命周期说明页面的创建过程

onLoad 页面你载入时执行的方法
onShow 页面显示时执行的方法
onReady 页面渲染完成时执行的方法
onHide 页面隐藏时执行的方法
onUnload 页面销毁时执行的方法

页面加载时会按上面的顺序一次执行，当页面切换属性的时候，onShow方法和onHide方法交替执行

常用事件方法

onPullDownRefresh : 监听用户下拉动作
onReachBottom: 监听也买你触底方法
onShareAppMessage: 监听分享方法

数据渲染原理 在微信小程序中，采用双线程模式

视图层的采用webview渲染
业务逻辑层面为js单独开辟一个线程

数据驱动 小程序是基于MVVM模式实现的，因此实现了数据驱动，定义上面数据就渲染什么数据 使用方法

在脚本文件中通过data属性定义数据
在页面中沟通过插值语法渲染数据

页面渲染

插值语法{{}}

微信插值语法并没有提供一个真真正正的js环境(伪js环境)

只能允许简单的运算（加减乘除）
以及对象获取属性的点语法，数组获取成员中的你给括号语法
不支持语句（内置的方法）

组件的属性和内容都可以使用插值语法

更新数据（在页面中，想修改绑定的数据，要使用setData方法）

this.setData({key,value}) 参数是对象
key 表示属性名小程序对属性名做了拓展可以表示直接属性，也可以使用间接子属性
value表示修改的数据

列如 var obj={a:{b:{c:100}}} a就是obj的直接属性，b和c就是obj的简介子属性，不许要通过a间接的获取，修改c的时候，key可以写成'a.b.c'

data:{
    obj:{
    color:'pink',
    size:{
        width:20,
        height:30
        }
    }
}
//直接修改
this.setData({
       obj:{
    //为了防止属性丢失要重写
    color:'pink',
    size:{
        width:20,
        height:40
        }
    }
}
})
//间接属性语法
this.setData({
    'obj.size.width':40
})

数据丢失

数据驱动就是指数据发生改变视图就会同步更新，如果数据改变了，但是视图没有更新，此时我们就说数据丢失了，数据丢失产生的原因是直接修改data中的数据，为了避免数据丢失，要通过setData方法去修改
小程序将更具setData修改的数据更新视图，为了提高性能，要尽量减少修改的数据（修改必要的数据）

setData({}) 更新对象或数组的用法

原数据

menu=[
 {id: "13", price: "22", title: "南洋鸡肉卷套餐", sales: "36", img: "13.jpg",num:0}，
 {id: "14", price: "23", title: "菠萝鸡腿堡套餐", sales: "38", img: "14.jpg", num:0}，
 {id: "15", price: "29", title: "双鸡堡套餐", sales: "33", img: "15.jpg",num:0}
 ]

更新数据的写法

addNum:function(e){
      let id=e.currentTarget.dataset.id;
      let num=1;
    this.data.menu.forEach((item,index)=>{
        if(item.id==id){
          console.log(item.num)
          let n=+item.num+num;
          if(n>=0){
            this.setData({
              ['menu['+index+'].num']:n
            })
          }
        }
      })
      }