封装了几个方法
This commit is contained in:
		
							
								
								
									
										18
									
								
								app.js
									
									
									
									
									
								
							
							
						
						
									
										18
									
								
								app.js
									
									
									
									
									
								
							@@ -1,17 +1,13 @@
 | 
				
			|||||||
 | 
					import { checkUpgrade, getConfigByEnv } from "./utils/index"
 | 
				
			||||||
 | 
					
 | 
				
			||||||
// app.js
 | 
					// app.js
 | 
				
			||||||
App({
 | 
					App({
 | 
				
			||||||
 | 
					  onShow() {
 | 
				
			||||||
 | 
					    checkUpgrade();
 | 
				
			||||||
 | 
					  },
 | 
				
			||||||
  onLaunch() {
 | 
					  onLaunch() {
 | 
				
			||||||
    // 展示本地存储能力
 | 
					    const { api } = getConfigByEnv();
 | 
				
			||||||
    const logs = wx.getStorageSync('logs') || []
 | 
					    this.globalData = { ...this.globalData, api, }
 | 
				
			||||||
    logs.unshift(Date.now())
 | 
					 | 
				
			||||||
    wx.setStorageSync('logs', logs)
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    // 登录
 | 
					 | 
				
			||||||
    wx.login({
 | 
					 | 
				
			||||||
      success: res => {
 | 
					 | 
				
			||||||
        // 发送 res.code 到后台换取 openId, sessionKey, unionId
 | 
					 | 
				
			||||||
      }
 | 
					 | 
				
			||||||
    })
 | 
					 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
  globalData: {
 | 
					  globalData: {
 | 
				
			||||||
    userInfo: null
 | 
					    userInfo: null
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -1,47 +1,10 @@
 | 
				
			|||||||
// index.js
 | 
					 | 
				
			||||||
const defaultAvatarUrl = 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
Page({
 | 
					Page({
 | 
				
			||||||
  data: {
 | 
					  data: {
 | 
				
			||||||
    motto: 'Hello World',
 | 
					    motto: 'Hello World',
 | 
				
			||||||
    userInfo: {
 | 
					 | 
				
			||||||
      avatarUrl: defaultAvatarUrl,
 | 
					 | 
				
			||||||
      nickName: '',
 | 
					 | 
				
			||||||
    },
 | 
					 | 
				
			||||||
    hasUserInfo: false,
 | 
					 | 
				
			||||||
    canIUseGetUserProfile: wx.canIUse('getUserProfile'),
 | 
					 | 
				
			||||||
    canIUseNicknameComp: wx.canIUse('input.type.nickname'),
 | 
					 | 
				
			||||||
  },
 | 
					 | 
				
			||||||
  bindViewTap() {
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
  onChooseAvatar(e) {
 | 
					  onShow() {
 | 
				
			||||||
    const { avatarUrl } = e.detail
 | 
					
 | 
				
			||||||
    const { nickName } = this.data.userInfo
 | 
					 | 
				
			||||||
    this.setData({
 | 
					 | 
				
			||||||
      "userInfo.avatarUrl": avatarUrl,
 | 
					 | 
				
			||||||
      hasUserInfo: nickName && avatarUrl && avatarUrl !== defaultAvatarUrl,
 | 
					 | 
				
			||||||
    })
 | 
					 | 
				
			||||||
  },
 | 
					 | 
				
			||||||
  onInputChange(e) {
 | 
					 | 
				
			||||||
    const nickName = e.detail.value
 | 
					 | 
				
			||||||
    const { avatarUrl } = this.data.userInfo
 | 
					 | 
				
			||||||
    this.setData({
 | 
					 | 
				
			||||||
      "userInfo.nickName": nickName,
 | 
					 | 
				
			||||||
      hasUserInfo: nickName && avatarUrl && avatarUrl !== defaultAvatarUrl,
 | 
					 | 
				
			||||||
    })
 | 
					 | 
				
			||||||
  },
 | 
					 | 
				
			||||||
  getUserProfile(e) {
 | 
					 | 
				
			||||||
    // 推荐使用wx.getUserProfile获取用户信息,开发者每次通过该接口获取用户个人信息均需用户确认,开发者妥善保管用户快速填写的头像昵称,避免重复弹窗
 | 
					 | 
				
			||||||
    wx.getUserProfile({
 | 
					 | 
				
			||||||
      desc: '展示用户信息', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
 | 
					 | 
				
			||||||
      success: (res) => {
 | 
					 | 
				
			||||||
        console.log(res)
 | 
					 | 
				
			||||||
        this.setData({
 | 
					 | 
				
			||||||
          userInfo: res.userInfo,
 | 
					 | 
				
			||||||
          hasUserInfo: true
 | 
					 | 
				
			||||||
        })
 | 
					 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
    })
 | 
					 | 
				
			||||||
  },
 | 
					 | 
				
			||||||
})
 | 
					})
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -1,27 +1,6 @@
 | 
				
			|||||||
<!--index.wxml-->
 | 
					<!--index.wxml-->
 | 
				
			||||||
<scroll-view class="scrollarea" scroll-y type="list">
 | 
					<scroll-view class="scrollarea" scroll-y type="list">
 | 
				
			||||||
  <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">
 | 
					 | 
				
			||||||
          <text class="nickname-label">昵称</text>
 | 
					 | 
				
			||||||
          <input type="nickname" class="nickname-input" placeholder="请输入昵称" bind:change="onInputChange" />
 | 
					 | 
				
			||||||
        </view>
 | 
					 | 
				
			||||||
      </block>
 | 
					 | 
				
			||||||
      <block wx:elif="{{!hasUserInfo}}">
 | 
					 | 
				
			||||||
        <button wx:if="{{canIUseGetUserProfile}}" bindtap="getUserProfile"> 获取头像昵称 </button>
 | 
					 | 
				
			||||||
        <view wx:else> 请使用2.10.4及以上版本基础库 </view>
 | 
					 | 
				
			||||||
      </block>
 | 
					 | 
				
			||||||
      <block wx:else>
 | 
					 | 
				
			||||||
        <image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>
 | 
					 | 
				
			||||||
        <text class="userinfo-nickname">{{userInfo.nickName}}</text>
 | 
					 | 
				
			||||||
      </block>
 | 
					 | 
				
			||||||
    </view>
 | 
					 | 
				
			||||||
  <view class="usermotto">
 | 
					  <view class="usermotto">
 | 
				
			||||||
      <text class="user-motto">{{motto}}</text>
 | 
					      <text class="user-motto">{{motto}}</text>
 | 
				
			||||||
    </view>
 | 
					    </view>
 | 
				
			||||||
  </view>
 | 
					 | 
				
			||||||
</scroll-view>
 | 
					</scroll-view>
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -27,6 +27,7 @@ page {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
.usermotto {
 | 
					.usermotto {
 | 
				
			||||||
  margin-top: 200px;
 | 
					  margin-top: 200px;
 | 
				
			||||||
 | 
					  text-align: center;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.avatar-wrapper {
 | 
					.avatar-wrapper {
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -2,6 +2,8 @@
 | 
				
			|||||||
  "description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档:https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
 | 
					  "description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档:https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
 | 
				
			||||||
  "projectname": "electricity_bill_calc_wx",
 | 
					  "projectname": "electricity_bill_calc_wx",
 | 
				
			||||||
  "setting": {
 | 
					  "setting": {
 | 
				
			||||||
    "compileHotReLoad": true
 | 
					    "compileHotReLoad": true,
 | 
				
			||||||
  }
 | 
					    "urlCheck": false
 | 
				
			||||||
 | 
					  },
 | 
				
			||||||
 | 
					  "libVersion": "development"
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
							
								
								
									
										61
									
								
								utils/index.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										61
									
								
								utils/index.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,61 @@
 | 
				
			|||||||
 | 
					/** 每次系统加载的时候判断是否有发版 */
 | 
				
			||||||
 | 
					export function checkUpgrade() {
 | 
				
			||||||
 | 
					  if (wx.canIUse('getUpdateManager')) {
 | 
				
			||||||
 | 
					    const updateManager = wx.getUpdateManager();
 | 
				
			||||||
 | 
					    updateManager.onCheckForUpdate(function (res) {
 | 
				
			||||||
 | 
					    if (res.hasUpdate) {
 | 
				
			||||||
 | 
					      // 弹出提示框,提示用户更新并重启小程序
 | 
				
			||||||
 | 
					      updateManager.onUpdateReady(function () {
 | 
				
			||||||
 | 
					        wx.showModal({
 | 
				
			||||||
 | 
					          title: '更新提示',
 | 
				
			||||||
 | 
					          showCancel: false,
 | 
				
			||||||
 | 
					          confirmText: '马上重启',
 | 
				
			||||||
 | 
					          content: '新版本已经上线,需要您重启小程序以应用新版本。',
 | 
				
			||||||
 | 
					          success: function (res) {
 | 
				
			||||||
 | 
					            if (res.confirm) {
 | 
				
			||||||
 | 
					              // 调用 applyUpdate 应用新版本并重启
 | 
				
			||||||
 | 
					              updateManager.applyUpdate();
 | 
				
			||||||
 | 
					            }
 | 
				
			||||||
 | 
					          }
 | 
				
			||||||
 | 
					        });
 | 
				
			||||||
 | 
					      });
 | 
				
			||||||
 | 
					      // 新版本下载失败时弹出提示框
 | 
				
			||||||
 | 
					      updateManager.onUpdateFailed(function () {
 | 
				
			||||||
 | 
					        wx.showModal({
 | 
				
			||||||
 | 
					          title: '更新失败',
 | 
				
			||||||
 | 
					          content: '新版本下载失败,请删除当前小程序,重新搜索打开。',
 | 
				
			||||||
 | 
					        });
 | 
				
			||||||
 | 
					      });
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					    });
 | 
				
			||||||
 | 
					  } else { // 如果用户微信版本过低,则弹出提示框
 | 
				
			||||||
 | 
					    wx.showModal({
 | 
				
			||||||
 | 
					      title: '提示',
 | 
				
			||||||
 | 
					      content: '当前微信版本过低,无法使用该功能,请升级到最新微信版本后重试。',
 | 
				
			||||||
 | 
					    });
 | 
				
			||||||
 | 
					  }
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					/** 根据不同环境获取不同参数 */
 | 
				
			||||||
 | 
					export function getConfigByEnv() {
 | 
				
			||||||
 | 
					  const result = wx.getAccountInfoSync();
 | 
				
			||||||
 | 
					  const { envVersion } = result.miniProgram;
 | 
				
			||||||
 | 
					  let api = ""
 | 
				
			||||||
 | 
					  switch (envVersion) {
 | 
				
			||||||
 | 
					    // 开发版
 | 
				
			||||||
 | 
					    case 'develop':
 | 
				
			||||||
 | 
					      api = "http://localhost:8000"
 | 
				
			||||||
 | 
					      break;
 | 
				
			||||||
 | 
					    // 体验版
 | 
				
			||||||
 | 
					    case 'trial':
 | 
				
			||||||
 | 
					      break;
 | 
				
			||||||
 | 
					    // 正式版
 | 
				
			||||||
 | 
					    case 'release':
 | 
				
			||||||
 | 
					      break;
 | 
				
			||||||
 | 
					  }
 | 
				
			||||||
 | 
					  return { api, }
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					/** 获取app.js中的globalData数据 */
 | 
				
			||||||
 | 
					export function getGlobalData() {
 | 
				
			||||||
 | 
					  const app = getApp();
 | 
				
			||||||
 | 
					  return app.globalData;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
		Reference in New Issue
	
	Block a user