微信小程序开发案例教程-项目三 微信小程序的配置和逻辑.pptx

微信小程序

开发案例教程;全书目录;项目三

微信小程序的配置和逻辑;项目导读;知识目标;;;任务描述;JSON（JavaScriptobjectnotation）是一种轻量级的数据交换格式，采用完全独立于编程语言的文本格式存储和表示数据，通常用于客户端和服务器之间的数据传输。;;;;;小贴士;（一）pages属性

pages属性是一个数组，用于配置小程序的页面路径，即指定小程序由哪些页面组成，它是全局配置文件中一个必填的属性。;为什么在pages属性中定义页面时无须加上扩展名？;小贴士;（二）window属性

window属性是一个JSON对象，用于配置小程序的导航栏、标题、窗口背景色等窗口表现。;小贴士;在全局配置文件中设置的window属性对每个页面都有效，当没有对window属性的某个配置项进行设置时，该配置项会自动取默认值。若全局配置文件中不包含window属性，则window属性的所有配置项都自动取默认值。;（三）tabBar属性

tabBar属性也是一个JSON对象，用于配置小程序底部或顶部的tab栏（通常是固定的选项卡形式）。如果小程序是一个多tab应用，利用tab栏可以切换页面。;list本质上是一个数组，数组中的每个元素都是一个JSON对象。;【例3-1】为样例小程序添加一个底部导航栏，导航栏包含“首页”和“日志”两个导航标签，可以通过以下两步实现。

第一步：在小程序项目的根目录下新建一个icons文件夹，并放入导航栏需要用到的图片。;{

pages:[

pages/index/index,

pages/logs/logs“

],

window:{

},

tabBar:{

backgroundColor:#ffffff,

color:#a9a9a9,

selectedColor:#000000,

borderStyle:black,

list:[{

pagePath:pages/index/index,

text:首页,

iconPath:icons/home-0.png,

selectedIconPath:icons/home-1.png;续前表;小贴士;怎样为样例小程序添加一个包含“首页”和“日志”两个导航标签的底部导航栏？;（四）其他属性

（1）networkTimeout属性。networkTimeout属性用于设置各类网络请求的超时时间，单位均为毫秒，当超过这个时间，则不再请求，该属性也是一个JSON对象。;（2）debug属性。debug属性用于开启debug模式。;全局配置文件通常用于对小程序的整体进行??置，要对某个页面进行单独设置可以使用该页面的JSON文件。;;;;;;;;任务描述;JavaScript（简称JS）是一种用于编写交互式网页和其他网络应用程序的编程语言。它是一种客户端脚本语言，可以在网页中执行，并通过控制网页的各种元素来实现动态效果和用户交互。;小贴士;;（一）数据类型;（二）变量和常量

1．变量

变量是指在程序运行过程中值可以改变的量，用于存放数据。所有的变量都必须先声明再使用，语法格式如下。;小贴士;;小贴士;2．常量

常量是指在程序运行过程中值不能改变的量，它在整个程序中只能赋值一次，语法格式如下。;（三）运算符

运算符是指具有运算功能的符号，使用运算符可以对变量、常量等进行运算，并得到运算结果。

1．算术运算符;小贴士;2．比较运算符;小贴士;3．逻辑运算符;4．赋值运算符

赋值运算符是将数据赋值给变量的运算符，主要有6种赋值运算符。;5．条件运算符

条件运算符属于三元运算符，即参与运算的对象有3个，语法格式如下。;（四）流程控制语句

在JavaScript中，通过流程控制语句可以控制代码的执行顺序。

1．条件语句

JavaScript中的条件语句主要有if语句和switch语句两种。

（1）if语句。

①简单if语句。当表达式为true时，才可执行语句块，语法格式如下。;②if…else语句。当表达式为true时执行语句块1，为false时执行语句块2，语法格式如下。;③if…elseif…else语句。当判断一系列条件时，一旦满足某一个条件就执行该条件对应的语句块，否则执行else语句块，语法格式如下。;例如，使用if语句判断商品价格，代码如下。;（2）switch语句。

switch语句通过数据匹配的方式实现程序的多分支控制，语法格式如下。;case后常量表达式的值必须与switch后表达式的值数据类型相同。;例如，使用switch语句判断分数等级，代码如下。;2．循环语句

在实际开发中，可以利用循环语句让程序循