微信小程序学习-01-目录及配置

• pages//对应页面目录
  • index//首页
    • index.js
    • index.wxml
    • index.wxss
  • logs//子页面
    • logs.js
    • logs.json
    • logs.wxml
    • logs.wxss
• utils//自己封装的工具函数
  • utils.js
• app.js//全局js
• app.json//全局配置文件
• app.wxss//全局样式
• project.config.json//项目描述

app.json

标签

• pages
  • 页面路径
• window
  • 全局默认窗口表现
  • navigationBarTitleText:导航栏页面标题
  • navigationBarBackgroundColor：导航栏背景颜色
  • navigationBarTextStyle：white/black
  • enablePullDownRefresh:是否开启下拉刷新
  • backgroundTextStyle:ligth/dark
• tabBar
  • list//对应的页面路径即配置
  • color:tab上文字默认颜色
  • selectedColor:tab上文字选中时颜色
  • backgroundColor:tab背景颜色
  • boderStyle：上边框颜色,black/white
  • position:bottom/top

{
  "pages": [
    "pages/index/index",
    "pages/home/home",
    "pages/logs/logs"
  ],
  "window": {
    "backgroundTextStyle": "dark",
    "navigationBarBackgroundColor": "#0094ff",
    "navigationBarTitleText": "火狐",
    "navigationBarTextStyle": "white",
    "enablePullDownRefresh":true
  },
  "sitemapLocation": "sitemap.json",
  "tabBar":{
    "color": "#000",
    "selectedColor":"#f23030",
    "backgroundColor":"#0094ff",
    "list":[
      {
        "pagePath":"pages/index/index",
        "text":"首页",
        "iconPath":"icons/index.jpg",
        "selectedIconPath":"icons/index_active.jpg"
      },
      {
        "pagePath": "pages/home/home",
        "text": "home",
        "iconPath": "icons/home.jpg",
        "selectedIconPath": "icons/home_active.jpg"
      },
      {
        "pagePath": "pages/logs/logs",
        "text": "日志",
        "iconPath": "icons/logs.jpg",
        "selectedIconPath": "icons/logs_active.jpg"
      }
    ]
  }
}

其他请查看微信小程序开发文档

page.json

标签

• navigationBarTitleText:导航栏页面标题
• navigationBarBackgroundColor：导航栏背景颜色
• navigationBarTextStyle：white/black
• enablePullDownRefresh:是否开启下拉刷新
• backgroundTextStyle:ligth/dark

{
  "usingComponents": {},
  "backgroundTextStyle": "light",
  "navigationBarBackgroundColor": "#0094ff",
  "navigationBarTitleText": "home",
  "navigationBarTextStyle": "black",
  "enablePullDownRefresh": true
}

其他请查看微信小程序开发文档