轻松入门微信小程序开发

---

小程序

项目结构与页面结构

对应我们的项目：

对于小程序的全局配置文件 app.json、app.wxss（遵循css语法），参照官方文档进行配置：全局配置、全局样式。

对于 app.js 会调用 App 方法创建小程序的实例对象，并定义应用的生命周期事件：

图中在 App 方法中还添加了一个对象，并在对象中编写了一个 onLaunch 方法（程序启动时执行），我们可以改成如下的形式同样会执行：


总结如下：

---

逻辑层

逻辑层指的是：json 和 js文件。

json文件： 实现标签栏

js文件：
小程序额外提供的成员

• App 方法：定义应用程序对象
• Page 方法：定义页面对象
• getApp 方法：获取全局应用程序对象（App）
• getCurrentPages 方法：获取当前页面的调用栈（数组）
  • 调用栈：访问页面的记录，最后的就是当前页面

小程序额外提供的对象：

• wx 对象：提供核心 api，参考 api

此外小程序 js 还支持 commonJS 规范：

---

界面层

数据绑定：首先参考官方文档.

简单绑定

• 内容

			<view class="container">
			  <text>{
  {messages}}</text>
			  <text>{
  {person.name}}</text>
			</view>

			Page({
   
			  data: {
   
			    message: 'Hello Moke!',
			    person: {
   
			      name: "MOKE",
			      sex: "male"
			    }
			  }
			})

• 组件属性

		<view class="{
    {uiView}}"></view>

		data: {
   
		    uiView: "hello"
		}

		.hello {
   
		  width: 100px;