Seko AI短剧一键生成成片剧云中文短剧剧本制作平台 LiblibAI 图片视频多模态创作 AniShort AI短剧协同制作平台

PHP MySQL jquery HTML CSS

微信小程序框架

MINA 文件目录结构小程序配置

逻辑层(App Service)

注册程序注册页面模块化 API

微信小程序 WXML

微信小程序数据绑定微信小程序条件渲染 wx:if 微信小程序列表渲染 wx:for 微信小程序模板微信小程序事件微信小程序引用微信小程序 WXSS 微信小程序基础组件微信小程序WeUI.js网页开发样式库

视图容器

微信小程序视图容器微信小程序可滚动视图区域微信小程序滑块视图容器

基础内容

微信小程序内容组件图标 icon 微信小程序内容组件 text（文本）微信小程序内容组件进度条：progress

表单组件

微信小程序按钮组件：button 微信小程序表单组件 checkbox 微信小程序表单组件 form 微信小程序表单组件输入框 input 微信小程序表单组件 label 微信小程序表单组件选择器 picker 微信小程序表单组件picker-view（嵌入页面的滚动选择器）微信小程序表单组件单选框 radio 微信小程序表单组件滑动选择器 slider 微信小程序表单组件开关 switch 微信小程序表单组件多行输入框 textarea

操作反馈

wxapp操作反馈上拉菜单 action-sheet wxapp操作反馈模式对话框 modal wxapp操作反馈消息提示框：toast wxapp操作反馈消息提示框：loading

微信小程序导航

微信小程序导航 navigator

媒体组件

媒体组件 audio 媒体组件 image 媒体组件 video（视频）

地图

微信小程序地图 map

画布

wxapp画布 canvas

客服会话

微信小程序组件 contact-button（客服会话按钮）

网络

微信小程序API 发起请求微信小程序API 上传、下载微信小程序API Websocket

媒体

微信小程序API 图片微信小程序API 录音微信小程序API 音频播放控制微信小程序API 音乐播放控制微信小程序API 视频微信小程序音频组件控制微信小程序视频组件控制微信小程序API 文件

数据

微信小程序API 数据缓存

位置

微信小程序API 位置微信小程序API 获取位置微信小程序API 查看位置微信小程序API 地图组件控制

设备

微信小程序API 系统信息微信小程序API 网络状态微信小程序API 重力感应微信小程序API 罗盘微信小程序API 拨打电话微信小程序API 扫码

界面交互

微信小程序API 交互反馈微信小程序API 设置导航条微信小程序API 导航微信小程序API 动画

绘图

开放接口

微信小程序API 登录微信小程序API 用户数据的签名验证和加解密微信小程序API 用户信息微信小程序API 微信支付微信小程序API 模板消息微信小程序API 接收消息和事件微信小程序API 发送客服消息微信小程序API 临时素材接口微信小程序API 接入指引微信小程序API 分享微信小程序API 获取小程序页面二维码

工具

微信小程序工具概览微信小程序工具程序调试的三大主要功能区微信小程序工具代码编辑微信小程序工具项目页卡三大主要功能微信小程序工具下载地址微信小程序工具细节点微信小程序开发者工具测试版本的下载微信小程序联系我们微信小程序 Q&A

微信小程序设计规范

微信小程序设计规范（1）友好礼貌微信小程序设计规范（2）清晰明确微信小程序设计规范（3）便捷优雅微信小程序设计规范（4）统一稳定微信小程序设计规范（5）视觉规范

微信小程序开发文档

更新时间2022-04-11

注册页面 API

文件作用域

在JavaScript文件中声明的变量和函数只在该文件中有效；不同的文件中可以声明相同名字的变量和函数，不会互相影响。

通过全局函数getApp()可以获取全局的应用实例，如果需要全局的数据可以在App()中设置，如：

// app.jsApp({
  globalData: 1
 })

// a.js
// The localValue can only be used in file a.js.
var localValue = 'a'
// Get the app instance.
var app = getApp()
// Get the global data and change it.
app.globalData++

// b.js
// You can redefine localValue in file b.js, without interference with the localValue in a.js.
var localValue = 'b'
// If a.js it run before b.js, now the globalData shoule be 2.
console.log(getApp().globalData)

模块化

我们可以将一些公共的代码抽离成为一个单独的js文件，作为一个模块。模块只有通过module.exports才能对外暴露接口。

需要注意的是：

exports 是 module.exports 的一个引用，因此在模块里边随意更改 exports 的指向会造成未知的错误。所以我们更推荐开发者采用 module.exports 来暴露模块接口，除非你已经清晰知道这两者的关系。
小程序目前不支持直接引入 node_modules , 开发者需要使用到 node_modules 时候建议拷贝出相关的代码到小程序的目录中。

// common.js
function sayHello(name) {
  console.log('Hello ' + name + '!')
}
module.exports = {
  sayHello: sayHello
}

在需要使用这些模块的文件中，使用require(path)将公共代码引入。

var common = require('common.js')
Page({
  helloMINA: function() {
    common.sayHello('MINA')
  }
})

ES6 语法以及 API 支持

微信小程序运行在三端：iOS、Android 和用于调试的开发者工具

在 iOS 上，小程序的 javascript 代码是运行在 JavaScriptCore 中
在 Android 上，小程序的 javascript 代码是通过 X5 内核来解析
在开发工具上，小程序的 javascript 代码是运行在 nwjs（chrome内核）中

虽然尽管三端的环境是十分相似的，但是至少在目前还是有一些区别的，这给很多开发者带来很大的困扰。

在 0.10.101000 以及之后版本的开发工具中，会默认使用 babel 将开发者代码 ES6 语法转换为三端都能很好支持的 ES5 的代码，帮助开发者解决环境不同所带来的开发问题。开发者可以在项目设置中关闭这个功能。

需要注意的是：

这种转换只会帮助开发处理语法上问题，新的 ES6 的 API 例如 Promise 等需要开发者自行引入 Polyfill 或者别的类库。
为了提高代码质量，在开启 ES6 转换功能的情况下，默认启用 javasctipt 严格模式，请参考 "use strict" 。

注册页面 API