小程序应用场景

一、Toast和模态对话框：特别要注意，对于错误信息我们不应该用Toast进行提示，因为错误提示需要明确告知用户具体原因，因此不适合用这种一闪而过的Toast弹出式提示。
      1、Toast提示默认1.5秒后自动消失。  wx.showToast 应与 wx.hideToast 配对使用  wx.hideToast是关闭提示
    wx.showToast({ // 显示Toast
          title: '已发送',
          icon: 'success',
          duration: 2000 //显示时间的长短
        })
     2、模态对话框
    wx.showModal({
            title: '标题',
           content: '告知当前状态，信息和解决方法',
          confirmText: '主操作',
          cancelText: '次要操作',
          success: function(res) {
         if (res.confirm) {
                  console.log('用户点击主操作')
            } else if (res.cancel) {
                  console.log('用户点击次要操作')
             }
           }
     })

二、本地存储
      1、写入本地数据
      （1）异步存储 ： 
    wx.setStorage({
          key:"a",
          data:{age:12},
          success(){
            console.log('1111');
          },
        })
      （2）同步存储：wx.setStorageSync('b', {name:'ssss'})
      2、读取本地数据
      （1）、异步操作 
    wx.getStorage({
          key:'a',
          success(res){
          console.log(res);
        }})
      （2）、同步操作：console.log(wx.getStorageSync('b'));
    
三、小程序的界面跳转
      1、wx.navigateTo ： 保留当前页面，只能打开非 tabBar 页面
    wx.navigateTo({
      url: 'test?id=1',
    })
      2、wx.redirectTo：关闭卸载当前页面，只能打开非 tabBar 页面。
    wx.redirectTo({
      url: 'test?id=1'
    })
      3、wx.switchTab：关闭所有非tabbar页面， 只能打开 tabBar 页面。
    wx.switchTab({
      url: '/index'
    })
      4、wx.reLaunch：关闭卸载所有页面，可以打开任意页面。
    wx.reLaunch({
      url: 'test?id=1'
    })
      5、wx.navigateBack：返回前面的页面，可以指定返回多少页，如果用过redirectTo，那么被关闭的页面将返回不去
    wx.navigateBack({
      delta: 2  //返回的页面数，如果 delta 大于现有页面数，则返回到首页。
    })
      6、声明式条状：<navigator url="../home/home?id=1">声明式条状</navigator>
四、HTTP的使用
      1、wx.request({
          url: '地址',
          method: "POST",
          data: {
            pageNum: 1,
            pageSize: 10
          },
          header: {
            "content-type": "application/x-www-form-urlencoded"
          },
          success: res => {
            console.log(res.data.rows)
          }
    })

    url    开发者服务器接口地址。注意这里需要配置域名
    data      请求的参数
    header    设置请求的 header，header 中不能设置 Referer，默认header['content-type'] = 'application/json'
    method（需大写）有效值：OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
    dataType    json    回包的内容格式，如果设为json，会尝试对返回的数据做一次 JSON解析
    success    收到开发者服务成功返回的回调函数。
    fail    接口调用失败的回调函数
    complete    接口调用结束的回调函数（调用成功、失败都会执行）
       2、http请求的封装
    function request(options) {
      // 请求拦截器
      //  ...
      // 1. 加一些统一的参数，或者配置
      if (!options.url.startsWith("https://") && !options.url.startsWith("http://")) {
        options.url = "https://showme2.myhope365.com" + options.url
      }
        // 默认的请求头
      let header = {
        "content-type": "application/x-www-form-urlencoded",
      };
      if (options.header) {
        header = {
          ...header,
          ...options.header
        }
      }

      return new Promise((reslove, reject) => {
        // 调用接口
        wx.request({
          // 默认的配置
          // 加载传入的配置
          ...options,
          header,
          success(res) {
            // 响应拦截器，所有接口获取数据之前，都会先执行这里
            //  1. 统一的错误处理
            if (res.statusCode != 200) {
              wx.showToast({
                title: '服务器异常，请联系管理员',
              })
            }

            reslove(res)
          },
          fail(err) {
            reject(err)
          }
        })
      })
    }

export function get(url, options = {}) {
  return request({
    url,
    ...options
  })
}

export function post(url, data, options = {}) {
  return request({
    url,
    data,
    method: "POST",
    ...options
  })
}