2小时轻松实现人脸识别小程序

首先扫码查看效果，觉得有意思可以跟着学哦~

## 基础要求:配套课程，下面内容是笔记哦

1. 掌握 HTML + CSS + JS

2. 了解微信小程序的基本使用

   + 会创建小程序项目和小程序页面
   + 知道小程序页面的组成部分及各自的作用

   + 会用 button，image，view 等小程序组件
   + 会使用 wx.request() 发起网络数据请求

   + 3小时入门微信小程序开发 http://stu.ityxb.com/openCourses/detail/263

3. 了解 ES6 常用语法

   + 箭头函数
   + let，const 等

## 动态设置 camera 组件的高度

1. 渲染 camera 组件

   ```xml
   <camera style="height: {
  {wh}}px; width: 100%;" flash="off"></camera>
   ```

2. 在 data 中定义 `wh`

   ```js
   data: {
       // 窗口可用的高度
       wh: 0
   }
   ```

3. 动态获取页面可用高度

   ```js
   /**
   * 生命周期函数--监听页面加载
   */
   onLoad: function(options) {
       const sysInfo = wx.getSystemInfoSync()
       this.setData({
           wh: sysInfo.windowHeight
       })
   }
   ```

   

## 隐藏 navigation 导航条

在 app.json 的 window 节点中，新增如下配置：

```json
{
  "pages": [
    "pages/home/home"
  ],
  "window": {
    // ... 省略其他配置
    "navigationStyle": "custom"
  },
  "sitemapLocation": "sitemap.json"
}
```

## 在 camera 组件之上渲染操作按钮

1. 定义如下的页面结构：

   ```xml
   <camera style="height: {
  {wh}}px; width: 100%;" flash="off">
     <cover-view class='btn-box'>
       <!-- 切换摄像头 -->
       <cover-image src='/images/icon/reverse.png'&