全局配置：

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”,//导航页面路径，根据路径匹配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

设置相对应的生命周期函数（初始化完成时onLaunch,显示onShow，隐藏onHide，错误的时候onerror）

设置全局数据：globalData属性进行设置，getApp（）可获取app.js的配置对象

4.1.导入文件方式：

<写要导入的具体内容标签>

4.2.将整个文件内容导入并显示方式：

include将页面header.wxml的内容全部导入，相当于将所有内容都复制过来

const openIdUrl = require(‘./config’).openIdUrl

//小程序应用的生命周期启示

//一般还会将全局的数据放置到初始化全局对象的globalData这个对像上

App({

onLaunch: function () {

console.log(‘App Launch’)

},

//小程序显示的时候（启动/后台切换到前台的时候启动）

onShow: function () {

console.log(‘App Show’)

},

//切换至后台，切换到其他微信页面，切换到其他程序，就会调用起这个函数

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:存储数据和方法（index.wxml视图页面元素相当于html）index.json表示当前页面的配置

Page({//表示当前文件下的page全局的page对象，所有的方法和数据

/**

* 页面的初始数据

*/

data: {

msg:’这是data里的数据’,

helloMsg: ‘helloWorld’,

obj:{

helloMsg:’欢迎词’,

otherText:’其他信息’

},

},

changeMsg:function(){

this.setData({

msg:’这是改变后的内容’,

})

1

},

clicktap:function(e){

console.log(e)

},

/**

* 生命周期函数–监听页面加载

*/

onLoad: function (options) {

},

/**

* 生命周期函数–监听页面初次渲染完成

*/

onReady: function () {

var appConfig = getApp()//getApp（）是获取全局变量globalData方法下的数据的函数方法

console.log(appConfig)

if(appConfig.globalData.hasLogin){

this.setData({

msg:’已登陆完成’

})

}else{

this.setData({

msg:’还未登陆，请登录’

})

}

},

/**

* 生命周期函数–监听页面显示

*/

onShow: function () {

var pageList = getCurrentPages()

console.log(pageList)

},

/**

* 生命周期函数–监听页面隐藏

*/

onHide: function () {

},

/**

* 生命周期函数–监听页面卸载

*/

onUnload: function () {

},

/**

* 页面相关事件处理函数–监听用户下拉动作

*/

onPullDownRefresh: function () {

},

/**

* 页面上拉触底事件的处理函数

*/

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

版权声明：本文为博主原创文章，转载请附上博文链接！