1.新建一个项目,选择无AppID ,保存
效果:
2.新建一个页面
在根目录下添加如下语句保存:
效果:
分别有4个文件:
<!--pages/welcome/welcome.wxml--> <text>pages/welcome/welcome.wxml</text>
// pages/welcome/welcome.js Page({ // 页面的初始数据 data: {}, // 生命周期函数--监听页面加载 onLoad: function (options) { }, // 生命周期函数--监听页面初次渲染完成 onReady: function () { }, // 生命周期函数--监听页面显示 onShow: function () { }, // 生命周期函数--监听页面隐藏 onHide: function () { }, // 生命周期函数--监听页面卸载 onUnload: function () { }, // 页面相关事件处理函数--监听用户下拉动作 onPullDownRefresh: function () { }, // 页面上拉触底事件的处理函数 onReachBottom: function () { }, // 用户点击右上角分享 onShareAppMessage: function () { } })
一般页面启动,会首先调用这三个函数:
onLoad(页面加载,一个页面只会调用一次)----->onShow(页面显示,页面每次打开都会调用)----->onReady(页面完成初次渲染)
page()函数中的data:{ }属性,通常是保存页面需要绑定的数据,一般在里面设置一个变量,用来接收从服务器加载来的JSON数据,然后在通过数据绑定的方式绑定到页面上面。
Page({ // 页面的初始数据 data: {}, })
app.js的生命周期
app.js是关于整个小程序项目的方法和属性,类似页面Page({...})函数,也需要一个外层函数包裹App({ ...})App({
//当小程序初始化完成时,会触发 onLaunch(全局只触发一次)
onLaunch: function () {
},
// 当小程序启动,或从后台进入前台显示,会触发 onShow
onShow: function (options) {
},
//当小程序从前台进入后台,会触发 onHide
onHide: function () {
},
// 当小程序发生脚本错误,或者 api 调用失败时,会触发 onError 并带上错误信息
onError: function (msg) {
}
})
// 应用程序的全局变量
globalData: {
defaultCity: '',
defaultCounty: '',
weatherData: '',
air: '',
day: '',
g_isPlayingMusic: false,
g_currentMusicPostId: null,
doubanBase: "https://api.douban.com",
heWeatherBase: "https://free-api.heweather.com",
juhetoutiaoBase:"https://v.juhe.cn/toutiao/index",
tencentMapKey: "4HYBZ-EB23D-SLC42-HQ5R3-LP3LQ-OZFU5",
heWeatherKey: "4a817b4338e04cc59bdb92da77714100",
juhetoutiaoKey:"a9f703a0200d68926f707f3f136290000",
curBook: ""
}}js文件中通过下面的方式来获取到里面定义的全局变量。var app = getApp(); var globalData = app.globalData