微信小程序调用豆瓣电影API（详细）

首先给出现在可以使用（有返回值的）的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”]

扫描二维码关注公众号，回复： 10777709 查看本文章

到此为止我们获取信息的函数就写完了

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>

你想获取什么数据可以自己查看它的变量名称在开发者的工作界面

到此为止我们的代码就写完了

希望可以帮到大家

附上我写的成果

由于最近喜欢成果小姐姐，轮播图放了她