7-6 电影页面嵌套template分析

快速新建页面

直接在app.json的pages[ ]里面添加新页面的路径。四个文件都新建了。

电影首页效果图：

导航，搜索，三排电影，会访问豆瓣公开api，一分钟只能访问40次，不要拼命加载。真实加载，真实数据。加载之前还是前后端分离的原则。先把前端样式写好，然后填写数据。wx.  什么什么的访问方法。相当于ajax网络访问api。

现在movie.wxml中写标签元素组件。

分析上面图，这么多重复的，更好的方式肯定使用template。

电影首页有三个重复元素，也就是三行，正在热映，即将上映，和top250（下面没显示出来）。所以这样的每一行，都可以做成一个template。如下。三行，复用三次。

但是里面的单个电影的样式，又可以在很多地方使用，那么把单个电影也要做成一个template。

单个电影做成template 在页面中使用单个电影的template

单个电影中的电影评分组件，依然可以做成一个template。在所有的电影项都可以使用，如下：

其他地方也可以使用这个电影评分组件：

因此这是一个三层嵌套使用的template。

下面把三层组件起一个名字：

组外层：movieList 、中层：movie、星星：star。

把下面9宫格一样的电影排布叫movieGread