简单的小程序操作介绍

1. 小程序项目结构
   1.1 pages:存放功能页面 √
   1.2 util：存放工具或插件
   1.3 app.js: 对整个小程序进行交互操作,例如onLauch就是整个小程序启动触发的一个函数 √
   1.4 app.json:存放路径[需要使用的路径(redirectTo)/添加编译模式需要使用的路径]，其他路径不需要存放 √
   1.5 app.wxss：存放全局样式
   

   image.png

2. 单个页面介绍
   2.1 如何跳转到该页面：使用redirectTo函数，url写上绝对路径:/pages/about/about/about.js
   2.2 小程序的每个页面都是由四个文件组成
   ①js文件：基本结构在创建时会自动生成，如果是需要提前渲染数据就在onLoad里发送请求，如果是需要用户操作之后再提交数据就在事件里发送请求(常见：点击提交按钮，触发formSummit函数)
   ②json文件：一般情况写入{}就好，如果需要引入组件：

  {
  "usingComponents": {
    "basics": "/pages/basics/home/home"
  }
}

③wxml文件：用<view></view>取代<div></div>，类似html
④wxss文件：样式只作用于本页面

image.png

3. 实现功能介绍
   3.1 上课暗号页面 --- 4
   3.2 通知页面 ---5

4. 上课暗号页面
   4.1 创建四个基础文件：注意同名
   4.2 wxml结构:

header-> 组件
form->content（全部内容）-> circle(整体样式) ->input输入暗号,下方button

4.3 wxss结构

content：作为circle的父盒子，做整体的居中样式
circle：作为input和buton的父盒子，做这两个的居中，并且做白色圆形背景

4.4 js结构：

const app = getApp();
// var util = require('../../../utils/util.js');
Page({
  //1.获取经纬度 -> getLocation
  //2.打卡：获取用户输入暗号，发送请求，返回提示 -> wx.request
})