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" />