微信小程序> 小程序文件类型介绍

小程序文件类型介绍

浏览量:500 时间: 来源:江苏小白龙

pages下有index.logs.utils3个文件夹和app.js.app.json.app.wxss.project.config.json文件
其中app文件为全局文件比如设置app颜色配置等
这么多文件大致分为3类后缀 js.wxml.wxss
js:函数点击事件网络加载等
wxxml:骨架节点组件等ui
wxss:布局文件

app.js

/app.jsApp({  //小程序启动初始化只走一次  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  }})

app.json文件 配置界面路径比如你创建了一个新界面要在这理绑定路径
window里面可以设置整个app的颜色

{  "pages":[  //如果新建界面写在最前面那么优先加载    "pages/index/index",    "pages/logs/logs",    //这是我新件的一个界面位于pages文件夹中的twoVC文件夹中名字叫twovc    "pages/twoVC/twovc"  ],  "window":{   "backgroundTextStyle":"left",    "navigationBarBackgroundColor": "#fff",    "navigationBarTitleText": "你好",    "navigationBarTextStyle":"black"  }}

project.config.json文件为配置信息比如你换了一台电脑项目还是一个项目那么要重新配置,有了它不需要了

index文件夹
有3个文件index.js index.wxml index.wxss
js:函数处理点击事件的
wxml:节点组件
wxss:样式
html+javascript+css
index.js文件配置如

Page({  /**   * 页面的初始数据   */  data: {    title:""  },  /**   * 生命周期函数--监听页面加载   */  onLoad: function (options) {    this.setData({     title:options.id,    })  },  /**   * 生命周期函数--监听页面初次渲染完成   */  onReady: function () {  },  /**   * 生命周期函数--监听页面显示   */  onShow: function () {  },  /**   * 生命周期函数--监听页面隐藏   */  onHide: function () {  },  /**   * 生命周期函数--监听页面卸载   */  onUnload: function () {  },  /**   * 页面相关事件处理函数--监听用户下拉动作   */  onPullDownRefresh: function () {  },  /**   * 页面上拉触底事件的处理函数   */  onReachBottom: function () {  },  /**   * 用户点击右上角分享   */  onShareAppMessage: function () {  }})

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

最新资讯

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎