微信小程序开发之数据请求

最近在学小程序,语法和Vue差不多。使用wx.request请求服务器数据,不需要跨域。

微信小程序开发之数据请求_第1张图片

一、使用豆瓣常用的开源接口

正在热映 :https://api.douban.com/v2/movie/in_theaters 

即将上映 :https://api.douban.com/v2/movie/coming_soon 

TOP 250 :https://api.douban.com/v2/movie/top250

电影详情 :https://api.douban.com/v2/movie/subject/:id 

二、html

请求远程数据前显示loading加载按钮,请求数据完成后隐藏按钮。并且使用\n实现换行。


  
    
  
  
    {{item.title}}\n
    {{item.summary}}\n
    {{item.countries[0]}}
  


  
  加载中...
  

三、js

Page({
  data:{
    // 数据
    content:{},
    // 按钮默认显示
    show:true
 },
// 生命周期
onLoad: function () {
    var that = this;
    wx.request({
      url: "https://api.douban.com/v2/movie/in_theaters",      
      data: {},
      header: {
        "Content-Type": "application/json"
      },
      success: function (res) {
        console.log(res.data.subjects);
        that.setData({
          content: res.data.subjects,
          // 隐藏loading按钮
          show:false
        })
      },
    });    
  }
})
微信小程序开发之数据请求_第2张图片
微信小程序开发之数据请求_第3张图片
微信小程序开发之数据请求_第4张图片

你可能感兴趣的:(微信小程序开发之数据请求)