• 记录 UniApp开发中遇到的坑


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

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

    方案:使用其它插件,推荐:uni-data-picker 

    2.input框被输入键盘覆盖

     

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

     

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

     解决:使用scrollIntoView

    1. //common/js/adjust
    2. /**
    3. * [$_blurAdjust 解决微信6.7.4版本在输入框弹出键盘后,页面没恢复]
    4. * @param {[type]} e [description]
    5. * @return {[type]} [description]
    6. */
    7. function blurAdjust( e ){
    8. // #ifdef H5
    9. setTimeout(()=>{
    10. if(document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA'){
    11. return
    12. }
    13. let result = 'pc';
    14. if(/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) { //判断iPhone|iPad|iPod|iOS
    15. result = 'ios'
    16. }else if(/(Android)/i.test(navigator.userAgent)) {  //判断Android
    17. result = 'android'
    18. }
    19. if( result = 'ios' ){
    20. // document.activeElement.scrollIntoViewIfNeeded(true);
    21. document.activeElement.scrollIntoView(true);
    22. }
    23. },500)
    24. // #endif
    25. }
    26. export default blurAdjust
    27. //./main.js
    28. import adjustView from 'common/js/adjust'
    29. Vue.prototype.$blurAdjust= blurAdjust
    30. //./src/pages/index.vue
    31. <input class="input-container" v-model="form.password" type="password" placeholder="请输入密码" :adjust-position="true" @blur.capture="this.$blurAdjust" />

  • 相关阅读:
    chrome 录制器及性能分析工具的使用
    什么是EVM?以太坊EVM合约交互
    Django 请求与相应实例及解决表单返回403问题方法
    cpp浅析STL-set
    探索iOS之CoreImage框架
    Casbin访问控制框架入门详解及Java案例示范
    low power-upf-vcsnlp(四)
    坚持写作是一个很难的事情
    初始JDBC 编程
    vue和react的diff算法源码
  • 原文地址:https://blog.csdn.net/Mr_linjw/article/details/133862078