微信小程序开发流程

1.打开微信开发平台进行小程序注册
具体的注册流程,可以参考官方的简易教程
2.下载微信小程序开发者工具并安装，下载路径：
安装登录工具

开发者工具安装完成后我们就可以将其打开，初次打开会需要用微信扫码登录，如下图，用手机微信扫一扫后确认登录就可以了
3.选择项目类型
4.创建项目
5.​ 1、app.js是小程序的脚本代码。我们可以在这个文件中监听并处理小程序的生命周期函数、声明全局变量。调用框架提供的丰富的 API，如本例的同步存储及同步读取本地数据。

2、​ app.json 是对整个小程序的全局配置。我们可以在这个文件中配置小程序是由哪些页面组成，配置小程序的窗口背景色，配置导航条样式，配置默认标题。注意该文件不可添加任何注释。

3、app.wxss 是整个小程序的公共样式表。我们可以在页面组件的 class 属性上直接使用 app.wxss 中声明的样式规则。

我们注意到，在实例程序的代码中还有2个文件夹，一个是pages,一个是style,其中style是放通用样式的一个文件夹，pages是存放所有页面的文件夹。我们着重讲一下这个pages.
　　小程序页面文件构成
　在这个示例中，我们有七个页面，index 页面，即欢迎页，他们都在 pages 目录下。微信小程序中的每一个页面的【路径+页面名】都需要写在 app.json 的 pages 中，且 pages 中的第一个页面是小程序的首页。

每一个小程序页面是由同路径下同名的四个不同后缀文件的组成，如：index.js、index.wxml、index.wxss、index.json。.js后缀的文件是脚本文件，.json后缀的文件是配置文件，.wxss后缀的是样式表文件，.wxml后缀的文件是页面结构文件。

​ index.wxml 是页面的结构文件：

<!--index.wxml-->
<view class="container">

  <!-- 用户 openid -->
  <view class="userinfo">
    <button
      open-type="getUserInfo"
      bindgetuserinfo="onGetUserInfo"
      class="userinfo-avatar"
      style="background-image: url({
   {avatarUrl}})"
    ></button>
    <view>
      <text>jackson影琪</text>
</view>
</view>

<view class="text-title">
      <text>Hello world</text>
</view>
</view>

//index.js
const app = getApp()

Page({
   
  data: {
   
    avatarUrl: './user-unlogin.png',
    userInfo: {
   },
    logged: false,
    takeSession: false,
    requestResult: ''
  },

  onLoad: function() {
   
    if (!wx.cloud) {
   
      wx.redirectTo({
   
        url: '../chooseLib/chooseLib',
      })
      return
    }

    // 获取用户信息
    wx.getSetting({
   
      success: res => {
   
        if (res.authSetting['scope.userInfo']) {
   
          // 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
          wx.getUserInfo({
   
            success: res => {
   
              this.setData({
   
                avatarUrl: res.userInfo.avatarUrl,
                userInfo: res.userInfo
              }