微信公众号开发记录

调用原生api获取相册图片

input.file-input(accept="image/*", type="file", ref="photo-input", @change="handleUpLoadImg")
handleUpLoadImg (e) {
    const file = e.target.files[0];
    const reader = new FileReader();
    reader.readAsDataURL(file); // 将图片转为base64方便页面展示,详见https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader/readAsDataURL
    reader.onload = function (d) {
        const imgData = reader.result;
        uploadFile(file); // 上传文件
    }
}

解决ios微信端失焦键盘隐藏后,被顶起的页面不回弹问题, vue代码片段

input(v-iosbugscroll)
function checkWxScroll() {
    var currentPosition, timer;
    var speed = 1;
    timer = setInterval(function() {
        currentPosition=document.documentElement.scrollTop || document.body.scrollTop;
        currentPosition-=speed;
        window.scrollTo(0,currentPosition);
        currentPosition+=speed;
        window.scrollTo(0,currentPosition);
        clearInterval(timer);
    }, 1);
}
Vue.directive('iosbugscroll', { // 解决ios微信端失焦键盘隐藏后,被顶起的页面不回弹问题
    inserted: function(el, binding, vnode) {
        let ua = navigator.userAgent.toLowerCase();
        if(/micromessenger/.test(ua)) {
            if(/iphone|ipad|ipod/.test(ua)) {
                // input、textarea被组件包装的场景
                const childInput = el.getElementsByTagName('input');
                const childTextarea = el.getElementsByTagName('textarea');
                for (let i = 0; i < childInput.length; i++) {
                    childInput[i].onblur = function temporaryRepair() {
                        setTimeout(function() {
                            checkWxScroll();
                        }, 200);
                    };
                }
                for (let i = 0; i < childTextarea.length; i++) {
                    childTextarea[i].onblur = function temporaryRepair() {
                        setTimeout(function() {
                            checkWxScroll();
                        }, 200);
                    };
                }
                // input、textarea中的场景
                el.onblur = function temporaryRepair() {
                    setTimeout(function() {
                        checkWxScroll();
                    }, 200);
                };
            }
        }
    }
});

posted @ 2020-10-28 10:18  fanlinqiang  阅读(76)  评论(0)    收藏  举报