微信小程序学习 -- 项目开发目录结构简析

来源：互联网发布：mac在ps没有足够ram 编辑：程序博客网时间：2024/06/07 00:34

通常一个页面可以配置后面几种文件，如 index.js(必须), index.wxml(必须), index.json, index.wxss. 其中 index.js是页面入口，index.wxml 配置页面ui, index.json属于配置文件，index.wxss是样式文件(类似css)

app.json

app.json 是小程序启动时必须提供的方法，如果没有就无法启动程序，它提供一个目录找到我们的首页

其中pages/pages/index是我们自己定义的目录结构，从根目录往下，最后一个index则指的是我们创建的 index.js

{
    "pages":[
        "pages/pages/index/index"
    ]
}

app.js页面

app.js 里面包含一个app() 方法，里面提供对应事件定义，如下

App({
  onLaunch: function () {
    console.log('App Launch')
  },
  onShow: function () {
    console.log('App Show')
  },
  onHide: function () {
    console.log('App Hide')
  }
})

普通的 .js 文件

.js 是页面入口，通常包含一个page() 方法，里面提供对各种事件处理的定义

Page({
  data:{
    // text:"这是一个页面"
  },
  onLoad:function(options){
    // 页面初始化 options为页面跳转所带来的参数
    console.log('App onLoad')
  },
  onReady:function(){
    // 页面渲染完成
    console.log('App onReady')
  },
  onShow:function(){
    // 页面显示
    console.log('App onShow')
  },
  onHide:function(){
    // 页面隐藏
    console.log('App onHide')
  },
  onUnload:function(){
    // 页面关闭
    console.log('App onUnload')
  } 
})

.wxml 文件

.wxml 文件可以配置文件ui, 下面最简单的例子

ly index

调试效果如下：

0 0