微信小程序猫眼电影的制作

猫眼电影（微信小程序）的制作

工具

微信开发者工具

app.json里面是配置文件

{
  "pages": [
    "pages/movie/movie",
    "pages/profile/profile",
    "pages/comment/comment"
  ],
  "window": {
    "backgroundColor": "#F6F6F6",
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#E54847",
    "navigationBarTitleText": "最新电影",
    "navigationBarTextStyle": "white"
  },
  "tabBar": {
    "color": "black",
    "selectedColor": "#E54847",
    "list": [
      {
        "pagePath": "pages/movie/movie",
        "text": "电影",
        "iconPath": "images/movie.png",
        "selectedIconPath": "images/movie-actived.png"
      },
      {
        "pagePath": "pages/profile/profile",
        "text": "我的",
        "iconPath": "images/user.png",
        "selectedIconPath": "images/user-actived.png"
      }
    ]
  },
  "sitemapLocation": "sitemap.json"
}

cloudfunctions里面是构建的云函数，里面的云函数文件夹每改动一次就要上传并部署
函数的入口文件：

// 云函数入口文件
const cloud = require('wx-server-sdk');

cloud.init()
var rp = require('request-promise');
// 云函数入口函数
exports.main = async (event, context) => {
  return rp(`http://api.douban.com/v2/movie/in_theaters?apikey=0df993c66c0c636e29ecbb5344252a4a&start=${event.start}&count=${event.count}`)
    .then(function (res) {
      // console.log(res);
      return res;
    })
    .catch(function (err) {
      console.error(err);
    });

  }

在miniprogram文件夹里面：

// pages/movie/movie.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    movieList:[]
  },
  getMovieList:function(){
    wx.showLoading({
      title: '加载中',
    })
    wx.cloud.callFunction({
      name: 'movieList',
      data: {
        start: this.data.movieList.length,
        count: 10
      }
    }).then(res => {
      // console.log(res);
      this.setData({
        movieList: this.data.movieList.concat(JSON.parse(res.result).subjects)
      });
      wx.hideLoading();
    }).catch(err => {
      console.error(err);
      wx.hideLoading();
    })
  },
  gotoComment:function(event){
    wx.navigateTo({
      url: `../comment/comment?movieid=${event.target.dataset.movieid}`,
    })
    
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
   this.getMovieList();
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    this.getMovieList();
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})

项目源码
https://gitee.com/duladula/cats_eye_movie_program.git
我在这个账号里也有上传