经验：项目积累

taoshi：

1. 用于商品详情的图片放大镜

vue-piczoom：vue-piczoom - npm

2.PC端地图经纬度获取

此方式非最佳，后面可以尝试vue-amap实现

2.2 pc端 接腾讯im

即时通信 IM 快速集成方案（Web） - 含 UI 快速集成方案（荐） - 文档中心 - 腾讯云

需要 腾讯IM 的AAPID ,KEY,商家端，用户端账号

3.budongchan：uniapp 页面代码生成图片插件 图片不能显示待解决 非最佳方案

canvas海报生成 图片合成 写页面一样生成海报内容 - DCloud 插件市场

4.duanshipin dati：

复杂公式的转义显示：mathjax.js mathjax文档 — MathJax 3.2 文档

<template>
	<view></view>
</template>

<script>
	export default {
		data() {
			return {}
		}
	}
</script>

<script module="MathJax" lang="renderjs">
  export default {
		data() {
			timer: null
		},
		mounted() {
			if (typeof window.MathJax === 'object') {
				this.init()
			} else {
			  const script = document.createElement('script')
			  script.src = 'static/mathjax.js'
			  script.onload = this.init.bind(this)
			  document.head.appendChild(script)
			}
		},
		methods: {
			init() {
				console.log('我进来了---')
				// console.log(window.MathJax, '333---')
				setTimeout(() => {
					// window.MathJax.typesetClear()
					// window.MathJax.texReset()
					window.MathJax.typeset()
				}, 1000)
			}
		},
		beforeDestroy() {
			clearInterval(this.timer)
			this.timer = null
		}
  }
</script>


<style lang="scss" scoped>

</style>

5.defa:

uniapp tabbar中间加突出按钮

触发点击：

6.app下载渠道统计： 使用openinstall

openinstall-App全渠道统计 - DCloud 插件市场

			// ------------------------openinstall---------------------------
			// #ifdef APP-PLUS
			
			
			const openinstall = uni.requireNativePlugin('openinstall-plugin');
			openinstall.init();
			// openinstall.registerWakeUp(function(result){
			//     console.log('getWakeup : channel=' + result.channelCode + ', data=' + result.bindData, '============================openinstal===================================');
			// });
			openinstall.getInstall(
				8,
				function(result) {
					// uni.showModal({
					// 	title: '111',
					// 	content: 'getInstall : channel=' + result.channelCode + ', data=' + result.bindData
					// })
					// let channelCode = '';
					// let data = '';
					if(result.bindData !== '') {
						// channelCode = res.channelCode;
						// data = result.bindData;
						// let shareInfo = JSON.parse(decodeURIComponent(data));
						uni.setStorageSync('shareUserId', JSON.parse(decodeURIComponent(result.bindData)).user_id);
						// console.log(uni.getStorageSync('shareUserId'))
						// uni.showModal({
						// 	title: uni.getStorageSync('shareUserId')
						// })	
					} 
					// else {
					// 	uni.showModal({
					// 		title: '222',
					// 		content: `${result.channelCode},${result.bindData}`
					// 	})
					// }	
				}
			)
			// #endif

7.dalianwuye：

i18n语言包使用：

// i18n部分的配置
// 引入语言包，注意路径
import Chinese from '@/common/locales/zh.js';
import English from '@/common/locales/en.js';

// VueI18n
import VueI18n from '@/common/vue-i18n.min.js';

// VueI18n
Vue.use(VueI18n);

const i18n = new VueI18n({
	// 默认语言
	locale: 'zh',
	// 引入语言文件
	messages: {
		'zh': Chinese,
		'en': English,
	}
});

// 由于微信小程序的运行机制问题，需声明如下一行，H5和APP非必填
Vue.prototype._i18n = i18n;

const app = new Vue({
	i18n,
	store,
	...App
});

 this.$t('nav.components')

8.peiwan:

融云im

import RongIMLib from './utils/RongIMLib-3.0.5-dev.min.js'



initIM:async function(){
			const that=this;
			const rongyun_config=await uni.getStorageSync("rongyun_config")

			//1,初始化
			var im = RongIMLib.init({
			  appkey: rongyun_config.app_key,//融云:app key
			  debug:true
			});
			// 定义全局变量im
			 this.globalData.im = im;
			console.log('userinfo------')

			const userinfo=await uni.getStorageSync("userinfo")
			//console.log('融云token未修改!!:'+userinfo.ry_token)
			// 2,获取当前用户token
			var user = {
			  token: userinfo.ry_token
			};//h6NJWmsZX2PFN+rAKINh12BDHjsBRz3F@swxq.cn.rongnav.com;swxq.cn.rongcfg.com

			// im 来自 RongIMLib.init 返回的实例，例如：var im = RongIMLib.init({ appkey: ' ' });
			//3.连接融云服务器,告诉第三方 当前用户在线
			//除初始化、监听以外，所有方法都必须在 connect 成功之后 再调用。
			im.connect(user).then(function(user) {
			  console.log('链接成功, 链接用户 id 为: ', user.id);
			  getApp().globalData.isLogin=true
			  console.log(getApp().globalData.isLogin)
			}).catch(function(error) {
			  console.log('链接失败: ', error.code, error.msg);
			});


			// 4.设置监听
			var conversationList = []; // 当前已存在的会话列表
			im.watch({
			  conversation: function(event){
/* 			    var updatedConversationList = event.updatedConversationList; // 更新的会话列表
			    console.log('更新会话汇总:', updatedConversationList);
			    console.log('最新会话列表:', im.Conversation.merge({
			      conversationList,
			      updatedConversationList
			    }));
				getApp().globalData.messageList=im.Conversation.merge({
			      conversationList,
			      updatedConversationList
			    }) */
			  },

			  message: function(event){
			    var message = event.message;
			    console.log('收到新消息:', message);
				// 震动
				uni.vibrateShort({
				    success: function () {
				        console.log('success');
				    }
				});

				const innerAudioContext = uni.createInnerAudioContext();
				innerAudioContext.autoplay = true;
				innerAudioContext.src = 'http://pic.ibaotu.com/00/43/58/92J888piCmbi.mp3';
				innerAudioContext.onPlay(() => {
				  console.log('开始播放');
				});
				innerAudioContext.onError((res) => {
				  console.log(res.errMsg);
				  console.log(res.errCode);
				});

			  },
			  status: function(event){
			    var status = event.status;
			    console.log('连接状态码:', status);
			  },
			  chatroom: function(event) {
			    var updatedEntries = event.updatedEntries;
			    console.log('聊天室 KV 存储监听更新:', updatedEntries);
			  },
			  })
		},

 9.upush推送

		// 推送---------------
		        // #ifdef APP-PLUS
		        const _self = this;
		        const _handlePush = function(message) {
					console.log(message)
					uni.navigateTo({
						url:'/pages/message/message_list'
					})
		        };
		        plus.push.addEventListener('click', function(message) {
		            //plus.nativeUI.toast('push click');
		            _handlePush(message);
		        });
		        plus.push.addEventListener('receive', function(message) {
		            //plus.nativeUI.toast('push receive');
		            _handlePush(message);
		        });
		        // #endif
		// -------------------

10.menggu qishou:

app语音播报：百度语音

 极光推送：

	var jpushModule = uni.requireNativePlugin("JG-JPush")



initJPush(){
			if(uni.getSystemInfoSync().platform == "ios"){
				// 请求定位权限
				let locationServicesEnabled = jpushModule.locationServicesEnabled()
				let locationAuthorizationStatus = jpushModule.getLocationAuthorizationStatus()
				console.log('locationAuthorizationStatus',locationAuthorizationStatus)
				if (locationServicesEnabled == true && locationAuthorizationStatus < 3) {
					jpushModule.requestLocationAuthorization((result)=>{
						console.log('定位权限',result.status)
					})
				}
				jpushModule.requestNotificationAuthorization((result)=>{
					let status = result.status
					if (status < 2) {
						uni.showToast({
							icon: 'none',
							title: '您还没有打开通知权限',
							duration: 3000
						})
					}
				})
			}
			// 初始化SDK
			jpushModule.initJPushService();
			// debug模式
			jpushModule.setLoggerEnable(true);
			// 连接状态
			jpushModule.addConnectEventListener(result=>{
				console.log('连接状态：-------------------',result)
				let connectEnable = result.connectEnable
				uni.$emit('connectStatusChange',connectEnable)
			});
			// 通知事件回调
			jpushModule.addNotificationListener(result=>{
				let notificationEventType = result.notificationEventType
				let messageID = result.messageID
				let title = result.title
				let content = result.content
				let extras = result.extras
				// console.log('通知事件回调',notificationEventType)
				if(notificationEventType=='notificationArrived'){
				  Voice('你有新的外卖订单，请及时接单');
				}else{
					jpushModule.setBadge(0)
				}
				uni.$emit('refreshIndex')
			});

		},

登录处：

jpushModule.setAlias({
									    'alias' : this.memberInfo.horseman_id.toString(),
									    'sequence': this.memberInfo.horseman_id.toString(),
									})
									console.log(jpushModule.queryAlias({
														'sequence': this.memberInfo.horseman_id.toString()
													}))

退出处：

jpushModule.deleteAlias({
   'sequence': memberInfo.horserman_id
  })

11.微信小程序获取手机号：

<button open-type="getPhoneNumber" v-if="!isBind" class="auth-login ns-border-color"
				@getphonenumber="mobileAuthLogin">
				<text class="ns-text-color ns-border-color">{{$lang('autoLogin')}}</text>
				<!-- <text class="iconfont iconweixin"></text> -->
			</button>


	//一键授权登录
			mobileAuthLogin(e) {
				let s = 'getPhoneNumber:ok';
				// #ifdef MP-ALIPAY
				s = 'getPhoneNumber:fail Error:';
				// #endif
				if (e.detail.errMsg.includes(s) != -1) {
					//微信小程序
					var data = {
						iv: e.detail.iv,
						encryptedData: e.detail.encryptedData
					};

 12.taiwan：

第三方google、facebook、line分享登录：MobTech集成文档-MobTech

13.在app内跳转webview回调页中转处理

地址选择

 14.xaingqin：

app一键登录 手机号获取：

uni.login({
					provider: 'univerify',
					univerifyStyle: {
						fullScreen: true
					},
					success:(res)=>{ // 登录成功

						// console.log(res.authResult); // {openid:'登录授权唯一标识',access_token:'接口返回的 token'}
						// 在得到access_token后，通过callfunction调用云函数
						uniCloud.callFunction({
							name: 'getPhoneNumber', // 你的云函数名称
							data: {
								'access_token': res.authResult
									.access_token, // 客户端一键登录接口返回的access_token
								'openid': res.authResult
									.openid // 客户端一键登录接口返回的openid
							}
						}).then(res1 => {
							// fixme:测试限制 测试成功过不再测试
							uni.setStorageSync('authLogin',1)
							console.log('sssssssssssssssss');
							console.log(res1.result)
							this.handleLogin(res1.result.res.phoneNumber)
							// res.result = {
							//   code: '',
							//   message: ''
							// }
							// 登录成功，可以关闭一键登录授权界面了
							uni.closeAuthView()
						}).catch(err => {
							// 处理错误
							console.log('err:', err)
						})
					},
					fail:(res)=>{ // 预登录失败
						// 不显示一键登录选项（或置灰）
						// 根据错误信息判断失败原因，如有需要可将错误提交给统计服务器
						console.log(res.errCode)
						console.log(res.errMsg)
						util.showToast({title:res.errCode+'：'+res.errMsg})
					}
				})

'use strict';
exports.main = async (event, context) => {
	//event为客户端上传的参数
	console.log('event : ', event)
	
	  // event里包含着客户端提交的参数
	  const res = await uniCloud.getPhoneNumber({
	      appid: '__UNI__7BF56A2', // 替换成自己开通一键登录的应用的DCloud appid，使用callFunction方式调用时可以不传（会自动取当前客户端的appid），如果使用云函数URL化的方式访问必须传此参数
	      provider: 'univerify',
	      apiKey: '7fb55cb0cebc817ae7f82ce63653832b-', // 在开发者中心开通服务并获取apiKey
	      apiSecret: 'f88b828057168a4536b238a811734098-', // 在开发者中心开通服务并获取apiSecret
	      access_token: event.access_token,
	      openid: event.openid
	  })
	
	  console.log(res); // res里包含手机号
	  // 执行用户信息入库等操作，正常情况下不要把完整手机号返回给前端
	  // 如果数据库在uniCloud上，可以直接入库
	  // 如果数据库不在uniCloud上，可以通过 uniCloud.httpclient API，将手机号通过http方式传递给其他服务器的接口，详见：https://uniapp.dcloud.net.cn/uniCloud/cf-functions?id=httpclient
	 // res形式如下
	 // {
	 //   code: 0,
	 //   message: '',
	 //   phoneNumber: '138xxxxxxxx'
	 // }
	  return {
	    code: 0,
		res,
	    message: '获取手机号成功'
	  }
};

 15.播放svga动画

16.跳转浏览器下载app页

 17.直播，im，nvue

18.jinqu

vue版 富文本编辑器 ：vue2-editor

Examples | Vue2Editor

19. oss存储 直传

20.jubensha

清除缓存：

		onReady() {
			let that = this
			// #ifdef APP-PLUS
			plus.cache.calculate(function(size) {
				console.log('缓存数据：', size)
				if (size == 0) {
					that.cacheSize = 0 + 'B'
				} else {
					that.convert(size)
				}
			})
			// #endif
		},

			

// 清除缓存
			cacheClear() {
				let that = this
				let $ua = this.$refs.uapopup
				$ua.open({
					type: 'ios',
					title: '<strong>提示</strong>',
					content: '<div style="color:#999;text-align:center;">确定要清除缓存？</div>',
					customStyle: {
						'border-radius': '25rpx',
						'overflow': 'hidden'
					},
					btns: [{
							text: '取消',
							style: 'color:#999;',
							click: () => $ua.close()
						},
						{
							text: '立即清除',
							style: 'color:#fd4928',
							click: () => {
								$ua.close()
								plus.cache.clear(res => {
									that.cacheSize = 0 + 'B'
								})
							}
						}
					]
				})
			},

			// 计算缓存大小
			convert(limit) {
				var size = "";
				if (limit < 0.1 * 1024) { //如果小于0.1KB转化成B  
					size = limit.toFixed(2) + "B";
				} else if (limit < 0.1 * 1024 * 1024) { //如果小于0.1MB转化成KB  
					size = (limit / 1024).toFixed(2) + "KB";
				} else if (limit < 0.1 * 1024 * 1024 * 1024) { //如果小于0.1GB转化成MB  
					size = (limit / (1024 * 1024)).toFixed(2) + "MB";
				} else { //其他转化成GB  
					size = (limit / (1024 * 1024 * 1024)).toFixed(2) + "GB";
				}

				var sizestr = size + "";
				var len = sizestr.indexOf("\.");
				var dec = sizestr.substr(len + 1, 2);
				if (dec == "00") { //当小数点后为00时 去掉小数部分  
					return sizestr.substring(0, len) + sizestr.substr(len + 3, 2);
				}
				console.log(sizestr)
				this.cacheSize = sizestr;
			},

21.dati 短视频答题 - uniapp去掉首次安装的权限提示

                "permissionExternalStorage" : {
                    "request" : "none",
                    "prompt" : "应用保存运行状态等信息，需要获取读写手机存储（系统提示为访问设备上的照片、媒体内容和文件）权限，请允许。"
                },
                "permissionPhoneState" : {
                    "request" : "none",
                    "prompt" : "为保证您正常、安全地使用，需要获取设备识别码（部分手机提示为获取手机号码）使用权限，请允许"
                },