模仿豆瓣电影小程序调电影接口
2019-08-12 本文已影响0人
Remember_柏查
1.需要动态获取top250电影数据,还有即将上映电影,最近热播的电影数据。因为api 的地址不可以用了 ,就把豆瓣的基地址改为 myApi = 'http://t.yushu.im'; myapi 是我定义的地址前缀在 api.js文件里面

2.因为他们三个样式都一样我wxml 编写的页面用的是template 模板的方式编写的页面 这样比较节省代码量也看起来比较美观,把页面分成了3个模板部分 ,星星组件一部分 ,然后一个电影 一部分 最后在3个电影排成的一列是一部分

3.模块嵌套这是首页先xml

3.1这是3个电影列的模板代码(我们要把每一个电影子项的xml导入进来)

3.2这是每一个电影子项模板代码

3.1这是评分项的模板班代码

4.页面写完了开始掉接口传递数据了我们把wx.request({})封装起来因为后面会一直调用一般这种公共的调用方法 我们写在util.js文件里面

5.因为我们有3个接口要掉 所以我们需要在写一个方法接收这些数据的结果 。我们定义一个数据来接受请求的数据moviedata 因为数据太多我们只需要三条显示 就截取了字符串 然后把需要的数据进行赋值 主题,还有评分,因为我们有三个请求,我们需要给请求的地址加一个参数变量,请求的时传递这个参数调用getdata:function(moviedata ,steekdata)


数据 readydata 解释
var readydata ={}
readydata[steekdata]=movie 动态属性赋值
that.setData(
readydata)//因为readydata已经是个对象了 所以这样写不会报错