uniapp 某些bug解决方法探究

1. 小程序 全屏禁止点击之后，ios的input事件仍能触发的问题

case1 你写了个透明遮罩覆盖全屏
case2.用了css属性“pointer-events:none”禁止点击事件
…
安卓是正常的，编译到ios上input就还能触发，这时候只能针对input绑定disabled属性挨个屏蔽掉。

		<view :class="wetherHave?'stop-click':''">
		</view>
		<!--遮罩层-->
<input  @input="changeColor" v-model="name" :disabled="wetherHave" type="text"/>

这个wetherHave就可以给Boolean值控制启用与否了,这种情况多用于提交表单之后重新进入到此界面有数据不可修改的情况

2.小程序 iOS端从A的子页面跳转B界面的时候闪一下A页面的问题 （A\B都是tabbar的页面）

常规来说跳转至tab页面都是使用uni.switchtab方法，但是由于wx小程序本身的问题，ios端会出现闪现到跳转的子页面的tab页面，故换成了relaunch替换，然后暂时解决

**

3.深克隆十全大补版本

**
定义一个深克隆方法如下

			deepClone(target) {
				// 定义一个变量
				let result;
				// 如果当前需要深拷贝的是一个对象的话
				if (typeof target === 'object') {
					// 如果是一个数组的话
					if (Array.isArray(target)) {
						result = []; // 将result赋值为一个数组，并且执行遍历
						for (let i in target) {
							// 递归克隆数组中的每一项
							result.push(this.deepClone(target[i]))
						}
						// 判断如果当前的值是null的话；直接赋值为null
					} else if (target === null) {
						result = null;
						// 判断如果当前的值是一个RegExp对象的话，直接赋值    
					} else if (target.constructor === RegExp) {
						result = target;
					} else {
						// 否则是普通对象，直接for in循环，递归赋值对象的所有值
						result = {};
						for (let i in target) {
							result[i] = this.deepClone(target[i]);
						}
					}
					// 如果不是对象的话，就是基本数据类型，那么直接赋值
				} else {
					result = target;
				}
				// 返回最终结果
				return result;
			},

使用方法 let a = this.deepClone(xxx)

4.自定义导航栏（兼容机型，单页面场景下）

首先写一个导航栏的结构：

<view class="header" :style="'height:'+topBarHeight+'px;'">
			<view class="title-text" :style="'height:'+ tabBarHeight+'px;margin-top:'+stateBarHeight+'px;'">
							<!-- 这是返回icon -->
				<view class="backIcon">
				</view>
				<text class="text">导航栏的名字啦</text>
			</view>
		</view>

其中topBarHeight、stateBarHeight、tabBarHeight需要去data定义

		stateBarHeight: 0, //导航栏高度
		tabBarHeight: 50, //状态栏高度
		topBarHeight: 0, //状态栏加导航栏高度

紧接着在生命周期里调用

			let that = this;
			uni.getSystemInfo({
				success: function(res) {
					that.stateBarHeight = res.statusBarHeight
					// #ifdef MP-WEIXIN
					let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
					let paddingSize = menuButtonInfo.top - that.stateBarHeight
					that.tabBarHeight = (menuButtonInfo.bottom - that.stateBarHeight) + paddingSize
					that.topBarHeight = menuButtonInfo.bottom + paddingSize
					// #endif
					// #ifdef APP-NVUE || APP-PLUS 
					let menuRect = wx.getMenuButtonBoundingClientRect()
					that.topBarHeight = menuRect.top + menuRect.height
					// #endif
					//向父组件传回头部高度
				},
			})

over 一个简易的自适应头部就完成了

5.高亮函数

             brightKeyword(val, keyword) {
        //val一整条数据，keyword输入的关键词
				const res = new RegExp(keyword, 'ig')
				return val.replace(res, (item) => {
					// item是匹配里面的原字符
					return `<font style='color: #13D3C3'>${item}</font>`
				})
			},