來源:熾熱可待 發(fā)布時間:2019-03-27 17:34:46 閱讀量:1688
全局配置:
1.1配置所有頁面路徑:在app.json的{pages:[配置所有頁面]},將首頁放置在第一位,在app.json必須寫上所有頁面的路徑,要不然會報錯,每個頁面的wxss樣式文件只在當前文件里有效
1.2設置tabBar導航:
“tabBar”: {
“color”: “#7A7E83”,//字體顏色
“selectedColor”: “#3cc51f”,//選中時候字體的顏色
“borderStyle”: “black”,//tabbar邊框的顏色,只有黑和白
“backgroundColor”: “#fff”,//背景顏色
“list”: [//2-5,只能設置2-5個導航
{
“pagePath”: “page/newPage/index”,//導航頁面路徑,根據(jù)路徑匹配tarbar導航是否顯示
“iconPath”: “image/icon_component.png”,//圖標圖片的路徑
“selectedIconPath”: “image/icon_component_HL.png”,//選中的時候圖片的路徑
“text”: “首頁”//按鈕文本
},
{
“pagePath”: “page/component/index”,
“iconPath”: “image/icon_component.png”,
“selectedIconPath”: “image/icon_component_HL.png”,
“text”: “組件”
}
]
}
2.window:窗口樣式的配置
3.注冊程序:app.js
設置相對應的生命周期函數(shù)(初始化完成時onLaunch,顯示onShow,隱藏onHide,錯誤的時候onerror)
設置全局數(shù)據(jù):globalData屬性進行設置,getApp()可獲取app.js的配置對象
4.1.導入文件方式:
<寫要導入的具體內容標簽>
4.2.將整個文件內容導入并顯示方式:
include將頁面header.wxml的內容全部導入,相當于將所有內容都復制過來
const openIdUrl = require(‘./config’).openIdUrl
//小程序應用的生命周期啟示
//一般還會將全局的數(shù)據(jù)放置到初始化全局對象的globalData這個對像上
App({
onLaunch: function () {
console.log(‘App Launch’)
},
//小程序顯示的時候(啟動/后臺切換到前臺的時候啟動)
onShow: function () {
console.log(‘App Show’)
},
//切換至后臺,切換到其他微信頁面,切換到其他程序,就會調用起這個函數(shù)
onHide: function () {
console.log(‘App Hide’)
},
globalData: {
hasLogin: true,
openid: null
},
// lazy loading openid
getUserOpenId: function(callback) {
var self = this
if (self.globalData.openid) {
callback(null, self.globalData.openid)
} else {
wx.login({
success: function(data) {
wx.request({
url: openIdUrl,
data: {
code: data.code
},
success: function(res) {
console.log('拉取openid成功', res)
self.globalData.openid = res.data.openid
callback(null, self.globalData.openid)
},
fail: function(res) {
console.log('拉取用戶openid失敗,將無法正常使用開放接口等服務', res)
callback(res)
}
})
},
fail: function(err) {
console.log('wx.login 接口調用失敗,將無法正常使用開放接口等服務', err)
callback(err)
}
})
}
}
})
5。index.js:存儲數(shù)據(jù)和方法(index.wxml視圖頁面元素相當于html)index.json表示當前頁面的配置
Page({//表示當前文件下的page全局的page對象,所有的方法和數(shù)據(jù)
/**
* 頁面的初始數(shù)據(jù)
*/
data: {
msg:’這是data里的數(shù)據(jù)’,
helloMsg: ‘helloWorld’,
obj:{
helloMsg:’歡迎詞’,
otherText:’其他信息’
},
},
changeMsg:function(){
this.setData({
msg:’這是改變后的內容’,
})
1
},
clicktap:function(e){
console.log(e)
},
/**
* 生命周期函數(shù)–監(jiān)聽頁面加載
*/
onLoad: function (options) {
},
/**
* 生命周期函數(shù)–監(jiān)聽頁面初次渲染完成
*/
onReady: function () {
var appConfig = getApp()//getApp()是獲取全局變量globalData方法下的數(shù)據(jù)的函數(shù)方法
console.log(appConfig)
if(appConfig.globalData.hasLogin){
this.setData({
msg:’已登陸完成’
})
}else{
this.setData({
msg:’還未登陸,請登錄’
})
}
},
/**
* 生命周期函數(shù)–監(jiān)聽頁面顯示
*/
onShow: function () {
var pageList = getCurrentPages()
console.log(pageList)
},
/**
* 生命周期函數(shù)–監(jiān)聽頁面隱藏
*/
onHide: function () {
},
/**
* 生命周期函數(shù)–監(jiān)聽頁面卸載
*/
onUnload: function () {
},
/**
* 頁面相關事件處理函數(shù)–監(jiān)聽用戶下拉動作
*/
onPullDownRefresh: function () {
},
/**
* 頁面上拉觸底事件的處理函數(shù)
*/
onReachBottom: function () {
},
/**
* 用戶點擊右上角分享
*/
onShareAppMessage: function () {
},
goPage(){
// wx.navigateTo({
// url: ‘/page/component/pages/button/button’,
// })
wx.redirectTo({
url: ‘/page/component/pages/button/button’,
})
}
})
---------------------
作者:熾熱可待
來源:CSDN
原文:https://blog.csdn.net/DL_JY847824/article/details/82427889
版權聲明:本文為博主原創(chuàng)文章,轉載請附上博文鏈接!