小程序基础

小程序基础

app.json 全局配置

pages

• 1 小程序中所有的页面，都需要再 pages 配置中指定
• 2 只要在 pages 中配置一个新的页面路径，微信开发者工具就会自动帮我们创建好这个页面
• 3 pages 数组的第一项作为 首页
• 4 页面文件夹和文件名称相同（约定）

window

• 用于设置小程序的状态栏、导航条、标题、窗口背景色。
• 如果需要给小程序设置外观样式，就配置 window

tabBar

• 设置小程序底部 Tab 菜单
• 注意：只有当前页面是 Tab 页面，才能看到 底部的 Tab 栏菜单

networkTimeout

• 网络超时时间

debug

• 是否开启 debug 模式，默认关闭

functionalPages

• 是否启用插件功能页，默认关闭

subpackages

• 分包结构配置 (相当于vue的按需加载)

workers

• Worker 代码放置的目录 (Html5 web Workers)

requiredBackgroundModes

• 需要在后台使用的能力，如「音乐播放」

plugins

• 使用到的插件

preloadRule

• 分包预下载规则 (性能优化)

resizable

• iPad 小程序是否支持屏幕旋转，默认关闭

navigateToMiniProgramAppIdList

• 需要跳转的小程序列表，详见 wx.navigateToMiniProgram

usingComponents

• 全局自定义组件配置

permission

• 小程序接口权限相关设置

sitemapLocation

• 指明 sitemap.json 的位置

常用组件

• 说明：所有小程序页面（wxml）都会被包裹在一个 page 组件（标签）中

view组件

• 类似于HTML的div标签

text组件

• 类似于HTML的span标签
• selectable: 文本是否可选
• space: 显示连续空格 (语法: space="nbsp")
• decode: 是否解码 (语法: text组件 <)

icon组件

• 类似于HTML的i标签
• 功能: 展示小图标
• type: icon的类型，有效值：success, success_no_circle, info, warn, waiting, cancel, download, search, clear

button组件

• 类似于HTML的button标签

checkbox组件

• 类似于HTML的input[type="checkbox"]

image组件

• 类似于HTML的img标签 特点: 小程序图片组件有默认的宽高 320px 240px

数据绑定

• 数据一般都是在 JS 中提供的，如果要把这些数据展示在页面中，需要通过 数据绑定{{}} 语法

转载于:https://juejin.im/post/5cfd09cf6fb9a07efb697904