夜光带你走进微信小程序研发（四）

最新推荐文章于 2022-04-01 23:50:11 发布

GeniusTeam-夜光

最新推荐文章于 2022-04-01 23:50:11 发布

阅读量349

点赞数

分类专栏： My thoughts 微信开发

本文链接：https://blog.csdn.net/weixin_41987706/article/details/90339616

版权

My thoughts 同时被 2 个专栏收录

911 篇文章 25 订阅

订阅专栏

微信开发

23 篇文章 1 订阅

订阅专栏

夜光序言：

对心灵如水，既柔顺又稳重，既驯服又坚强，可弯而不可折的人，我会永远温柔和真诚。

正文：

小程序目录结构

小程序的目录结构主要包含项目配置文件、主体文件、页面文件和其他文件。

夜光将基于 Hello World 小程序对目录结构进行分析，并对 hello World 小程序进行理解与简单修改。

项目配置文件

新建小程序时，都会自动生成一个项目配置文件，即项目根目录下的

project.config.json 文件

如图所示。项目配置文件中主要通过定义项目名称、AppID 等内容来对项目进行配置。

主体文件

一个小程序的主体文件有三个文件组成，必须放在项目的根目录下

主体文件均以 app 为前缀，共分为三个文件

1.app.js

app.js 为系统的方法处理全局文件，也就是说文件中规定的函数和数据，在整个小程序中，每一个框架页面和文件都可以使用 this 获取。每个小程序都会有一个 app.js 文件，有且只有一个，位于项目的根目录。

该文件 App()函数用来注册一个小程序。接受一个 object 参数，其指定小程序的生命周期函数等。详见：

https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/app.html

App（）函数

//app.js
App({
  onLaunch: function () {
    // 展示本地存储能力
    var logs = wx.getStorageSync('logs') || []
    logs.unshift(Date.now())
    wx.setStorageSync('logs', logs)

    // 登录
    wx.login({
      success: res => {
        // 发送 res.code 到后台换取 openId, sessionKey, unionId
      }
    })
    // 获取用户信息
    wx.getSetting({
      success: res => {
        if (res.authSetting['scope.userInfo']) {
          // 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
          wx.getUserInfo({
            success: res => {
              // 可以将 res 发送给后台解码出 unionId
              this.globalData.userInfo = res.userInfo

              // 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
              // 所以此处加入 callback 以防止这种情况
              if (this.userInfoReadyCallback) {
                this.userInfoReadyCallback(res)
              }
            }
          })
        }
      }
    })
  },
  globalData: {
    userInfo: null
  }
})