小程序学习（五）

数据的绑定

在之前的小程序学习中，所有页面的相关数据都是直接进行硬编码的，这种方式对于那种不需要怎么变化的页面还算可取，但对于经常在变化的页面，这种方法就会加大工作量，并且容易出错，所以学会对数据进行绑定就显得尤为重要。
1.对于数据的绑定，我们可以使用这样一串赋值语句来实现：
document.getElementById(“t001”）.innerHTML=thisWeekMovie.name
但是这种基于DOM API手动更新视图的方法有两个缺点：
（1）这种方式需要我们在收到数据之后，或者说每次这个数据被更新的时候都需要我们执行这样的代码来实现对这个视图的更新。
（2）维护起来比较困难。
综上，我们需要学习另一种方法来实现数据的绑定，让视图中的每一个部分与对应的数据做一个映射。
2.在小程序框架中，每个页面都是在其对应的脚本文件中通过调用page函数来来给这个页面注册他所需要的页面对象，通过data属性来定义他所需要的各种数据。

以这个页面为例，我们需要在week.js文件中对data属性进行编辑：

以score做示范，现在的问题就是我们如何把score的值渲染输出到视图上显示呢？我们是通过一个双大括号对数据进行绑定的。

同样的，对于名字以及评价这些数据，我们也可以用同样的方法实现数据绑定，如图：

运用这段代码和之前直接进行硬编码的页面实现效果是一样的。对于score，我们还可以使用条件表达式来进行输出显示，

将代码修改成这样，页面也会随之产生变化：

对于一些比较简单的数据的绑定，这种方法还是比较可取的。关于数据绑定的学习，就暂时进行到这里。
最后，有两个前面学习到的知识点想要补充：
（1）配置tabBar后原来的navigator元素点击会无效，这时候navigator元素中的open-type的值不能再是默认的navigate，需要修改为switchTab.
（2）对于导航栏的配置，如果每一个页面都用复制的方法来实现，那必然会带来代码升级的问题，因此我们可以直接在全局配置文件app.json中通过window属性来实现。