WeChat mini App Guide

小程序开发入门

小程序由主程序和页面组成。

主程序由以下文件构成,放在项目的根目录中:

文件名 作用
app.js 调用 App() 函数,传入对象,声明应用、全局变量
app.json 全局配置,声明小程序构成的页面、等
app.wxss 全局样式表
project.config.json 项目配置文件:定义小程序名、声明 AppID

页面放在 pages 目录下,一个页面一个子目录。每个页面由与子目录同名的以下 4 种文件构成:

文件名 作用
.js 调用 Page() 函数,传入对象,声明页面、页面变量
.wxml
.json (可选) 页面配置,覆盖全局 window 配置
.wxss (可选)

WXML

页面定义文件。

代码 作用
{{变量名}} 动态绑定 data 属性定义的对象里的属性

条件控制

wx:if="{{condition}}" 可以用来判断是否需要显示某区域。

<view wx:if="{{condition}}">

</view>

JS

变量与函数默认只在当前文件有效。

全局变量

app.js 中可以定义全局变量,变量名无限制。

定义

App({
  globalData: {
    user: null
  }
});

引用

var app = getApp();
var user = app.globalData.user;

公共函数

通过 module.experts 或 exports 可以定义公共函数。

定义

function log(params) {
  console.log(parmas);
}

module.exports.log = exports.log = log;

引用

var util = require('util.js');

util.log("Hello, world!");

参考资料

小程序开发需要微信开发工具编译、发布小程序。访问、预览小程序可以借助小程序助手。

微信开发者工具 https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html
小程序助手
Author: njun
njun's picture
Updated: 2019/12/23