微信小程序——1.起步

1.小程序简介

1. 小程序与普通网页开发的区别
   1. 运行环境不同：小程序运行在微信环境中
   2. API 不同：无法调用DOM和BOM的API
   3. 开发模式不同

2.第一个小程序

https://mp.weixin.qq.com/ 注册小程序开发账号
安装开发者工具

3.小程序代码的构成

1. 项目基本组成结构

2. 小程序页面的组成部分

3. json配置文件

1. app.json文件
   全局配置，包括所有页面路径pages、窗口外观window、界面表现、底部tab
   style：全局定义小程序组件所使用的样式版本
   在 app.json -> pages 中新增页面的存放路径，即可创建新的页面

   2. project.config.json文件
      setting 中保存了编译相关的配置
      projectname 中保存的是项目名称
      appid 中保存的是小程序的账号 ID
   3. sitemap.json文件
   4. 每个页面的.json文件
      对本页面的窗口外观进行配置，页面中的配置项会覆盖app.json 的 window 中相同的配置项。

2. WXML模板
   WXML 和 HTML 的区别
   ① 标签名称不同
   HTML （div, span, img, a）
   WXML（view, text, image, navigator）
   ② 属性节点不同
   超链接
   
   ③ 提供了类似于 Vue 中的模板语法
   数据绑定
   列表渲染
   条件渲染

3. WCSS样式

4. 小程序中 .js 文件的分类
   小程序中的 JS 文件分为三大类，分别是：
   ① app.js
   是整个小程序项目的入口文件，通过调用 App() 函数来启动整个小程序
   ② 页面的 .js 文件
   是页面的入口文件，通过调用 Page() 函数来创建并运行页面
   ③ 普通的 .js 文件
   是普通的功能模块文件，用来封装公共的函数或属性供页面使用

4.小程序的宿主环境

小程序宿主环境包含的内容
① 通信模型
通信的主体：渲染层和逻辑层
WXML 模板和 WXSS 样式工作在渲染层
JS 脚本工作在逻辑层
② 运行机制
③ 组件
④ API

1.API

2.组件

1.view 组件的基本使用

2. scroll-view 组件的基本使用

在使用scorll-view要给scroll-view固定的高度

3. swiper 和 swiper-item 组件的基本使用

4.常用的基础内容组件

1. text
   文本组件
   类似于 HTML 中的 span 标签，是一个行内元素
   

2. rich-text
   富文本组件
   支持把 HTML 字符串渲染为 WXML 结构
   

5. 其他常用组件

1. button
   按钮组件
   功能比 HTML 中的 button 按钮丰富
   通过 open-type 属性可以调用微信提供的各种功能（客服、转发、获取用户授权、获取用户信息等）
   

2. image
   图片组件
   image 组件默认宽度约 300px、高度约 240px
   
   

3. navigator（后面课程会专门讲解）
   页面导航组件
   类似于 HTML 中的 a 链接

5.协同工作和发布