一、认识小程序
1.什么是小程序？
小程序是一种不需要下载，安装即可使用的应用
2.小程序与普通网页开发的区别？
①运行的环境不同
网页是在浏览器环境中，小程序是在微信环境中
②API不同
由于运行环境不同，小程序中无法调用DOM、BOM、API，但是小程序中可以调用微信环境中的各种API，例如：地理定位 、扫码、支付
③开发模式不同
网页的开发模式：浏览器+代码编辑器；
小程序有自己的一套标准开发模式
申请小程序开发账号==>安装小程序开发者工具==>创建和配置小程序项目；
④标签不同
网页标签：div、span、img等
小程序标签：view、text、image等
3.项目的基本组成结构
①pages用来存放所有小程序的页面
（小程序官方建议把所有的小程序页面，都存放在 pages 目录中，每个页面以单独的文件夹存在）
②utils用来存放工具性质的模块
③app.js小程序项目的入口文件
（.js 文件 -- 页面的脚本文件，存放页面的数据、事件处理函数、生命周期等）
④app.json小程序项目的全局配置文件
（.json 文件 -- 当前页面的配置文件，配置页面的外观、表现等）
⑤app.wxss小程序项目的全局样式
⑥proiect.config.json项目的配置文件
⑦sitemap.json用来配置小程序以及页面是否被微信搜到
二、项目说明与知识点
1、如何将小程序页面设置为首页
①调整app.json/pages数组中页面路径的前后顺序，即可修改项目的首页
②在app.json配置一个新的节点entryPagePath接口
2、什么是WXML？
它是框架设计的一套标签语言（组件），用来构件小程序页面的结构，作用类似于网页开发中的HTML
3、wxss和css的区别？
①wxcss新增了rpx尺寸单位，css中需要手动进行像素单位的换算，如：rem
②wxss在底层支持新的尺寸单位rpx,在不同大小的屏幕上小程序会自动进行换算
③wxss仅支持部分css选择器（.class和#id、element、并集选择器和后代选择器、::after和 ::before等伪类选择器）
④@import
4.小程序中JS文件的三大类
①app.js是整个小程序项目的入口文件，通过调用App（）函数来创建小程序页面，并运行小程序页面
②页面的.js文件是页面的入口文件，通过调用Page ( )函数来创建小程序需的页面，并运行小程序
③普通的.js文件是普通的功能模块文件，用来封装公共的函数或属性供页面使用
5.小程序宿主环境包含的内容？
通信模型、运行机制、组件、API
6.小程序的通信主体？
渲染层和逻辑层（WXML和WXSS样式工作在渲染层，JS脚本工作在逻辑层）
7.小程序的通信模型？
①渲染层 和 逻辑层 之间的通信------由微信客户端进行转发
②逻辑层 和 第三方服务器 之间的通信------由微信客户端进行转发
8.小程序的启动过程？
①把小程序的代码包下载到本地，从缓存中拿代码包
②解析app.json全局配置文件
③执行app.js小程序入口文件，调用App（）创建小程序实例
④渲染小程序首页
⑤小程序启动完成
9.页面渲染的过程？
①加载解析页面的json文件
②加载页面的.wxml模板和.wxss样式
③执行页面的.js文件，调用Page（）创建页面实例
④页面渲染完成
10.微信给小程序都提供了哪些组件？
① 视图容器 ② 基础内容 ③ 表单组件 ④ 导航组件 ⑤ 媒体组件 ⑥ map 地图组件 ⑦ canvas 画布组件 ⑧ 开发能力 ⑨ 无障碍访问
11.常用的视图容器类组件?
①view 组件
view
②scroll-view 组件
scroll-view
③swiper 和 swiper-item 组件
轮播图容器组件和轮播图 item 组件
swiper 组件的常用属性
④text（类似于 HTML 中的 span 标签，是一个行内元素） 和 rich-text 组件（支持把 HTML 字符串渲染为 WXML 结构）
效果显示
⑤button 按钮组件（通过 open-type 属性可以调用微信提供的各种功能(客服、转发、获取用户授权、获取用户信息等)）
button属性
⑥image图片组件（image 组件默认宽度约为 300px 、高度为 240px）
应用
src -- 支持本地和网络上的图片
mode -- 指定图片的裁剪、缩放的模式
MODE值
网友评论