微信小程序基础开发

基本概念：

小程序宿主环境 | 微信开放文档

语法结构入门：

1.WXML讲解：

教程 | 《小程序开发指南》

（1）数据绑定： WXML 通过 {{变量名}} 来绑定 WXML 文件和对应的 JavaScript 文件中的 data 对象属性。

（2）条件逻辑： WXML 中，使用 wx:if="{{condition}}" 来判断是否需要渲染该代码块：

（3）列表渲染： 在组件上使用 wx:for 控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该组件。默认数组的当前项的下标变量名默认为 index，数组当前项的变量名默认为 item

（4）模板： WXML提供模板（template），可以在模板中定义代码片段，然后在不同的地方调用。

使用 is 属性，声明需要的使用的模板，然后将模板所需要的 data 传入

（5）引用： WXML 提供两种文件引用方式import和include。

import 可以在该文件中使用目标文件定义的 template； import 有作用域的概念，即只会 import 目标文件中定义的 template，而不会 import 目标文件中 import 的 template，简言之就是 import 不具有递归的特性。

include 可以将目标文件中除了 <template/> <wxs/> 外的整个代码引入，相当于是拷贝到 include 位置

2.WXSS讲解：

(1) 支持动态更新样式：

<!--index.wxml-->

<!--可动态变化的内联样式-->

<!--

{

  eleColor: 'red',

  eleFontsize: '48rpx'

}

-->

<view style="color: {{eleColor}}; font-size: {{eleFontsize}}"></view>

（2）选择器：

3.JS文件讲解;

(1) 脚本执行顺序： 小程序的执行的入口文件是 app.js 。并且会根据其中 require 的模块顺序决定文件的运行顺序

当 app.js 执行结束后，小程序会按照开发者在 app.json 中定义的 pages 的顺序，逐一执行。

（2）作用域：

全局变量： 当需要使用全局变量的时，通过使用全局函数 getApp() 获取全局的实例，并设置相关属性值，来达到设置全局变量的目的

app.js中设置全局变量：