微信小程序开发之路（一）

今天来为大家讲讲微信小程序，大概讲一下在开发小程序时需要注意的几个点。在开始之前先了解下微信小程序是个什么东西吧。

微信小程序（weixinxiaochengxu），简称小程序，缩写XCX，英文名mini program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。

以上是百度百科中对微信小程序的定义。简单来讲，微信小程序是为了优化用户体验，相对于原生App来说它具有“用完即走，无需安装”的优点，而相对于传统网页来说又具有加载速度更快并且更安全的优点。总之，本人挺喜欢小程序的，看好它。
好了，言归正传，拿好笔划重点咯~~~

一、微信小程序属单向绑定，而并非双向绑定

什么是单向绑定？什么是双向绑定？
单向绑定是MVVM框架中的一种数据处理模式，它是将Model（也就是数据层）中的数据绑定到View（也就是表现层），当JS中的数据发生改变时，View也会相应发生改变。而双向绑定则更加强大，当View中数据发生改变时，JS中的数据也会响应发生改变，一般是用在表单当中。
个人觉得微信小程序长得非常像最近特别火的前端框架Vue.js，Vue小而轻，用起来特别方便，而且很容易入门，属双向绑定。但是小程序虽然表面长得跟Vue很像，却只能单向绑定数据，Model改变View则跟着改变，View改变Model却不变。
那问题来了，有时候表单类控件内容发生改变时需要在Model中相应做出改变时怎么处理呢？
这个其实也不难，对小程序开发文档相对熟悉的应该知道，表单类控件一般都带有类似bindinput和bindchange之类的事件处理属性，这样就可以用这些属性绑定自定义函数来改变Model中的数据了。

二、不能通过this.key=value的方式来直接改变Model中的内容进而改变View

这也是小程序与Vue的区别之一。Vue可以直接通过this.key=value的方式直接改变View，而小程序只能通过this.setData({ key: value })的方式来改变View。但是需要注意的是，小程序当中也可以使用this.key=value，但是并不能改变Model，只是在Page对象中创建一个新的属性并赋值而已，一般可以通过此方式来实现Page对象属性之间的通信。简单举个栗子吧~~~

Page({
  data:{
    name: ""  // [1]
  },
  onLoad(){   //页面加载时执行
    this.setName();
    this.getName();
  },
  name: "",   // [2]
  //自定义方法，此写法属ES6语法
  setName(){  
    this.setData({
      //此处可以改变 [1] 处的name的值，并在View中渲染相应值
      name: "Hello World!"
    });
    //此处不能改变 [1] 处的name的值，改变的只是 [2] 处name 的值
    this.name = "Hello Wechat!";   
  },
  getName(){
    console.log( this.data.name );   // "Hello World!"
    console.log( this.name );   // "Hello Wechat!"
  }
});

好了，今天就先分享到这里，后面会跟大家分享更多微信小程序开发的知识哦~~~

本文为原创文章，转载请注明出处，谢谢！