微信小程序数据交互

微信小程序有两个特点

1、前后端分离，通过http接口进行数据交换

2、页面数据渲染与逻辑处理分离

小程序交互

如上图所示，页面有事件发生时JS会根据事件类型做出相应处理。

常用事件类型包含如下几种：

//页面初始化
1、 onLoad: function (options) { 
          //options，url参数对象
   }   
//用户上拉刷新
2、onReachBottom: function () {
   }  
 //用户分享
3、onShareAppMessage: function () { 
   }
//点击事件  
4、bindViewTap:function(event){      
   }

当我们刚进入一个页面时，首先会进行页面初始化，也就是执行onLoad事件。

这时候要执行http请求以获取所需的数据！

onLoad:function(options){
     let url = 'https://wxapis.vdongchina.com/xxx/api.php'
     let data = {
          token:6,
          id:1
     }
     //调用http方法(promise)
     var that = this
     httpGet(url,data).then(function(res){
          //业务处理逻辑begin
          let data = res.data.Response 
          //1.处理逻辑1
          //2.处理逻辑2
          ....................
          //3.处理逻辑n

          //渲染到视图层
          that.setData({
              datalist:data
          })
          //业务处理逻辑end
     })
}

//页面示例

  {{index}} 
  {{item.message}} 

基本上，其他的事件处理也是这个模式，需要注意的是存在变化的地方！

1、url，每个url表示一个接口，用以满足不同的业务需求
2、data，每个接口都需要独特的上行参数
3、业务处理逻辑，通常会执行一系列操作然后渲染到视图层

如何应对变化？

业务需求会比较频繁的变更，如果每次变更都要修改代码，那么出错的概率会比较大，所以需要有一种策略来应对需求变化。