微信小程序调用豆瓣电影API(详细)
微信小程序调用豆瓣电影API(详细)
- 首先给出现在可以使用(有返回值的)的API网址
- 现在是获取数据的过程
- 1.在 JS 文件中声明一个变量
- 2.我们写一个获取信息的函数
- 我们打开 ==当前热映的API网址==
- 进到开发者模式后我们可以看见
- 啥都看不懂
- 再看我们为什么这样写
- 到此为止我们获取信息的函数就写完了
- 3.我们需要调用, 我们在onload函数中调用它。
- 到此为止 JS 文件写好了
- 我们现在要让在屏幕中显示
- 献上代码
- 你想获取什么数据可以自己查看它的变量名称在开发者的工作界面
- 到此为止我们的代码就写完了
- 希望可以帮到大家
- 附上我写的成果
- 由于最近喜欢成果小姐姐,轮播图放了她
首先给出现在可以使用(有返回值的)的API网址
正在热映的影片
https://douban.uieee.com/v2/movie/in_theaters
豆瓣排行前250的影片
https://douban.uieee.com/v2/movie/top250
即将上映的影片
https://douban.uieee.com/v2/movie/coming_soon
现在是获取数据的过程
1.在 JS 文件中声明一个变量
Page({data: {movie: [] //存储我们得到的信息}
})
2.我们写一个获取信息的函数
loadMovie: function () {var that = this; // 大家可以将that看为全局变量 (我c语言学得多)wx.request({url: 'https://douban.uieee.com/v2/movie/in_theaters', //url 中输入我们的API网址;//想获取排名就粘入排名的API网址// header: {// 'content-type': 'application/json'//这是默认的格式,这种格式我们获取不了API提供的信息//(我也不知道为啥,大家知道的话可以告诉我一下2333)// },header: {"Content-Type": "application/text" //我们要改为text},success(res) {var subjests = res.data; //res.data 是我们获取的信息//下面我告诉大家为什么这样写that.setData({movies: subjests["subjects"], //将我们需要的信息存储});}})
我们打开 当前热映的API网址
链接: 豆瓣当前热映.
用 Google Chrome打开,我们进到开发者工具
Windows用户 按F12
Mac OS 用户 按 command+option+I
进到开发者模式后我们可以看见
啥都看不懂
给大家教怎么看
在 console 中
声明一个变量 var a
var a = (全选页面的代码粘入) 回车
输入 a 回车
如下
step1
step2
再输入 a 回车
现在我们可以看到详细信息了
(是不是感觉成功了)
再看我们为什么这样写
success(res) {var subjests = res.data; //res.data 是我们获取的信息//下面我告诉大家为什么这样写that.setData({movies: subjests["subjects"], //将我们需要的信息存储});
每一部影片的详情都是存储在一个subjects[ ] 中的
已知 var subjects=res.data 是总体数据
我们需要的正是总体数据中的subjects
所以我们给 movies 赋值 subjects[“subjects”]
到此为止我们获取信息的函数就写完了
3.我们需要调用, 我们在onload函数中调用它。
/*** 生命周期函数--监听页面加载*/onLoad: function (options) {this.loadMovie();},
到此为止 JS 文件写好了
我们现在要让在屏幕中显示
献上代码
<block wx:for="{{movies}}" wx:for-item="i">// i 是每一部电影<view class="picture"><image src="{{i.images.medium}}" mode="aspectFill"/>//这是电影的宣传图</view><view class="info"><view class="information"><text >片名: {{i.title}}\n\n</text><view wx:for="{{i.casts}}" wx:for-item="j" > <view >主演:{{j.name}}</view></view><view wx:for="{{i.directors}}" wx:for-item="k"><text >\n导演:{{k.name}}</text></view><text >\n{{i.mainland_pubdate}}(中国大陆)</text></view></view></block>
你想获取什么数据可以自己查看它的变量名称在开发者的工作界面
到此为止我们的代码就写完了
希望可以帮到大家
附上我写的成果
由于最近喜欢成果小姐姐,轮播图放了她
微信小程序调用豆瓣电影API(详细)相关推荐
- 微信小程序访问豆瓣电影API 403 400
解决方法 nginx做代理,并改变请求的Referer和User-Agent头部信息 location / { proxy_pass http://localhost:8080/; } loc ...
- 微信小程序访问豆瓣电影api400错误解决方法
微信小程序访问豆瓣电影api400错误解决方法 参考文章: (1)微信小程序访问豆瓣电影api400错误解决方法 (2)https://www.cnblogs.com/bubbleStar/p/610 ...
- 微信小程序调用新闻类API
做过微信小程序的伙伴都知道,当我们需要实现一个小程序中类似于新闻资讯的功能时,需要我们调用一个外部实时更新的新闻数据接口,从而将数据展示在我们的手机页面上.那么我们该如何实现这个功能呢?下面我们来实现 ...
- 微信小程序-访问豆瓣电影api400错误
今天听去年九月份的小程序教程,豆瓣api哪里的请求头是这样 header:{'Content-Type': 'application/json'}, 软件升级后要改为 header:{'Content ...
- 微信小程序之豆瓣电影
效果图: 1.小程序下方的tabBar,属于公共的设置,需要在app.json里面设置 2.引入的文件放置的位置,图片放在images 3.代码 当前热映 index/index.wxml <v ...
- 微信小程序调用拨打电话API,实现选择拨打固话或手机号。
HTML 部分: <span @click='calltel()'> 拨号或添加到通讯录 </span> JavaScipt 部分: (vue中 ,
- 微信小程序—模拟豆瓣搜索电影(图文)
微信小程序-模拟豆瓣搜索电影 先新建search目录和page 1.在search.wxml页面 给input添加bindinput事件 给input写一个value值,用来清空 给button绑定b ...
- 微信小程序调用腾讯地图API进行驾车路线规划
微信小程序调用腾讯地图API进行驾车路线规划 申请key 下载sdk 实现代码 遇到的问题 申请key 微信小程序的地图api是非常有限的,所以部分功能实现需要调用地图api.使用腾讯地图api过程如 ...
- 微信小程序获取用户手机号码,Java后台servlet解密(微信小程序调用微信支付也是大致的流程)
本篇记录说明 微信小程序获取用户手机号码,Java后台servlet解密(微信小程序调用微信支付也是大致的流程,详细内容可私信交流) (第一次写博客,写得不好的地方见谅,面向新手,大佬请无视,不喜勿喷 ...
最新文章
- Sourse Insight使用教程及常见的问题解决办法
- 程序设计分析(开篇)——混沌初开,顿悟设计
- 如何用人工智能帮你找论文?
- Access里执行SQL
- 2007年3月东北微软技术活动预告
- 深度丨110亿美金还不够,阿里使用这种AI手段创造更多广告收入
- horizon client长时间不操作不断开_动挡操作禁忌,伤车只在一瞬间!否则变速箱会提前...
- 工程师男友如何反窃听?趣聊密码学入门科普
- AE开发右键缩放至图层
- eclipse wsdl2java_使用Eclipse的wsdl2java工具
- java有几种变量_java有多少种变量?java类变量怎么使用?
- Vigenère密码(洛谷P1079题题解,Java语言描述)
- redisTemplate的hscan方法中为何不需要指定游标开始地址的原因
- python的简单程序代码_有那些用python修改python程序代码的简单方法?
- Android优美代码赏析:Snake游戏分析
- 华为身处“创新者的窘境”,而浑然不觉(转载)
- 五金冲压模具设计分享pressCAD外挂使用小窍门
- 电脑桌面计算机点开一直在刷新,Win10系统桌面一直在刷新怎么办
- 【菜鸟学习论文】2020_Wasserstein Distances for Stereo Disparity Estimation
- 拉格朗日乘子法、对偶、KTT