第一章总结

认识微信小程序

一、微信小程序的特点
1. 无需安装：用户无需下载安装即可使用，节省手机存储空间。
2. 触手可及：用户通过扫描二维码或搜索关键词即可快速找到并使用小程序。
3. 无需卸载：小程序不占用手机桌面空间，用户无需卸载，随时可用。
4. 开发成本低：相较于原生APP，小程序的开发成本较低，周期较短。
5. 功能丰富：小程序支持多种功能，如支付、地图导航、音视频播放等。
6. 跨平台：小程序支持Android和iOS操作系统，实现跨平台应用。

二、微信小程序的应用领域
1. 电商购物：提供便捷的线上购物体验，如拼多多、京东等。
2. 餐饮外卖：方便用户在线点餐、订餐，如美团外卖、饿了么等。
3. 旅游出行：提供旅游攻略、酒店预订等服务，如携程、去哪儿网等。
4. 教育培训：提供在线课程、学习资源等，如网易云课堂、腾讯课堂等。
5. 医疗健康：提供在线咨询、预约挂号等服务，如好大夫在线、春雨医生等。
6. 本地生活：提供周边服务信息，如58同城、大众点评等。

第一个微信小程序

page {
  height: 100vh;
  display: flex;
  flex-direction: column;
}

.scrollarea {
  flex: 1;
  overflow-y: hidden;
}

.userinfo-avatar {
  overflow: hidden;
  width: 128rpx;
  height: 128rpx;
  margin: 20rpx;
  border-radius: 50%;
}

 <view class="container">
    <view class="userinfo">
      <block wx:if="{{canIUseNicknameComp && !hasUserInfo}}">
        <button class="avatar-wrapper" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar">
          <image class="avatar" src="{{userInfo.avatarUrl}}"></image>
        </button>
        <view class="nickname-wrapper">

开发工具界面功能介绍

1. 代码编辑：提供代码编辑功能，支持实时预览、错误检查等功能。
2. 模拟器：支持在电脑上模拟小程序的运行环境，方便开发者调试。
3. 调试工具：提供丰富的调试工具，如网络请求、日志输出、性能分析等。
4. 组件库：提供丰富的组件库，方便开发者快速搭建小程序界面。
5. API文档：提供详细的API文档，方便开发者查阅和使用。
6. 云开发：提供云数据库、云存储、云函数等服务，简化后端开发流程。

常用的几个模块：

Wxml：是定位到具体的代码上

Console面板：调试小程序的控制面板，当代码执行出现错误时，错误信息将显示在Console面板中，便于开发者排查错误

Sources面板：是源文件调试信息页，用于显示当前项目的脚本文件

Network面板：是网络调试信息页，用于观察和显示网络请求request和socket等网络相关的详细信息。