1.主要代码
movies.wxml文件
<navigator url=‘/movieDetail/movieDetail?index={{item}}‘ wx:for=‘{{moviesArr}}‘ wx:key=‘index‘> <view class=‘moviesContainer‘> <image class=‘movieImg‘ src="{{item.images.large}}"></image> <view class=‘movie_detail‘> <text class=‘movie_name‘>{{item.original_title}}</text> <text class=‘movie_year‘>年份:{{item.year}}</text> <text clas=‘movie_director‘>导演：{{item.director[0].name}}</text> </view> <text class=‘movie_rating‘>{{item.rating.average}}</text> </view> </navigator>
movies.js文件
使用wx.request发送请求，在小程序中出于安全考虑所有的协议都是https协议，且如果没有用开发设置中配置请求的连接时无法访问的。可在（详情-本地设置-不检验合法...）设置。注意一个微信小程序的并发网络请求数量只限制在最多5个。所以在详情页面中，避免不要再发送请求。因此，在主页面获取相关信息后直接存入appDatas中，进入详情界面后直接从中取数据。
const MOVIE_URL = ‘http://t.yushu.im/v2/movie/in_theaters?apikey=0b2bdeda43b5688921839c8ecb20399b‘; let appDatas = getApp(); Page({ //页面的初始数据 data: { moviesArr:[] }, //生命周期函数--监听页面加载 onLoad: function (options) { wx.request({ url: MOVIE_URL, sucess: (res)=>{ 更新状态值 this.setData({ moviesArr:data.subjects }) appDatas.globalData.moviesArr = moviesArr //将数据存入到appDatas中 } }) } })
movieDetail.wxml文件
<view class=‘movieDetailContainer‘> <image class=‘movie_img‘ src=‘{{movieDetail.images.large}}‘></image> <text class=‘movie_name‘>{{movieDetail.original_title}}</text> <view class=‘movie_detail‘> <text>评分：{{movieDetail.rating.average}}</text> <text>导演：{{movieDetail.directors[0].name}}</text> <text>主演：{{movieDetail.casts[0].name}}</text> </view> <button>我要观影</button> </view>
movieDetail.js文件
let appDatas = getApp(); //去除数据 Page({ //页面的初始数据 data: { movieDetail: {} }, //生命周期函数--监听页面加载 onLoad: function (options) { console.log(options); this.setData({ movieDetail: appDatas.globalData.moviesArr(option.index) }) } })
App.js文件
App({ globalData: { userInfo: null, isPlay: false, pageId: null, moviesArr: [] } })
App.json
{ "pages": [ "pages/index/index", "pages/movies/movies", "pages/list/list", "pages/detail/detail", "pages/movieDetail/movieDetail" ], "window": { "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#489881", "navigationBarTitleText": "welcome", "navigationBarTextStyle": "black" }, "style": "v2", "sitemapLocation": "sitemap.json", "requiredBackgroundModes": [ "audio" ], "tabBar": { "list": [ { "pagePath": "pages/list/list", "text": "文与字", "iconPath": "/images/tab/yuedu.png", "selectedIconPath": "/images/tab/yuedu_hl.png" }, { "pagePath": "pages/movies/movies", "text": "电影频道", "iconPath": "/images/tab/dianying.png", "selectedIconPath": "/images/tab/dianying_hl.png" } ] } }