请求电影详情页数据

在首页或列表页单击进入电影详情页

修改app.json，添加item详情页配置，代码如下

{
  "pages": [
    "pages/index/index",
    "pages/splash/splash",
    "pages/list/list",
    "pages/item/item"
  ]
}

接下来，在item.js中请求subject集合数据，代码如下

var db = wx.cloud.database();
db.collection("subject")
.get()
.then(res =>{
  console.log(res)
  that.setData({ movie: res.data[0]});
})

在实际开发中会使用从上一页面传过来的id作为参数，请求服务器当页的详情数据

本案例中直接使用subject集合的第一条数据作为详情页数据
把请求到的数据保存在data的movie属性中显示在页面上

详情页的代码如下

<view class="weui-article">
  <view class="weui-article__section">
    <image class="weui-article__img" src="{{ movie.images.large }}"
    mode="aspectFit" style="width: 100%;height: 800rpx" />
  </view>
  <view class="weui-article__h1">{{ movie.title }}({{ movie.year }})</view>
  <view class="weui-article__section">
    <view class="weui-media-box__info" style="margin-top:10rpx;">
      <view class="weui-media-box__info__meta">评分：{{ movie.rating.average }}</view>
    </view>
    <view class="weui-media-box__info" style="margin-top:10rpx;">
      <view class="weui-media-box__info__meta">导演：
        <block wx:for="{{ movie.directors }}" wx:key="{{ item.id }}"> {{ item.name }} </block>
      </view>
    </view>
    <view class="weui-media-box__info" style="margin-top:10rpx;">
      <view class="weui-media-box__info__meta">主演：
        <block wx:for="{{ movie.casts }}" wx:key="{{ item.id }}"> {{ item.name }} </block>
      </view>
    </view>
  </view>
  <view class="weui-article__section">
    <view class="weui-article__p">
      {{ movie.summary }}
    </view>
  </view>
</view>