记录 UniApp开发中遇到的坑

1.使用自带picker下拉选数据时，但选择太快时，点击确定后无法选择数据

原因：picker带有动画，在滑动选择时，当动画结束后才会真正选中值

方案：使用其它插件，推荐：uni-data-picker 

2.input框被输入键盘覆盖

 

inpu的cursor-spacing属性，可以设置键盘到输入框的距离

 

 3:输入框输入完毕收缩后，页面底部保留空白区域（大小跟键盘尺寸一直）

 解决：使用scrollIntoView

//common/js/adjust
/**
 * [$_blurAdjust 解决微信6.7.4版本在输入框弹出键盘后，页面没恢复]
 * @param  {[type]} e [description]
 * @return {[type]}   [description]
 */
function blurAdjust( e ){
	// #ifdef H5
	setTimeout(()=>{
		if(document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA'){
			return
		}

		let result = 'pc';
	    if(/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) { //判断iPhone|iPad|iPod|iOS
	        result = 'ios'
	    }else if(/(Android)/i.test(navigator.userAgent)) {  //判断Android
	        result = 'android'
	    }

	    if( result = 'ios' ){
			// document.activeElement.scrollIntoViewIfNeeded(true);
			document.activeElement.scrollIntoView(true);
	    }
	},500)
	// #endif
}

export default blurAdjust


//./main.js
import adjustView from 'common/js/adjust'
Vue.prototype.$blurAdjust= blurAdjust


//./src/pages/index.vue
<input class="input-container" v-model="form.password" type="password" placeholder="请输入密码" :adjust-position="true" @blur.capture="this.$blurAdjust" />