最近的一些总结(滑动卡顿，vue 加载前加loading，iframe跨域)

最近在切前端页面，写一些前端特效，做一个下拉刷新的时候，下拉卡顿，加了一个 css 属性，

.recommend .swiper-wrapper{
    -webkit-overflow-scrolling: touch;//该属性随着手指离开还会保持滚动
}

还有就是做左右滑动的时候,css 现在已经有现在的了,设置如下属性就可以很好的到达想要的效果
overflow: scroll;
-webkit-overflow-scrolling: touch;//该属性随着手指离开还会保持滚动

vue的总结，首先 vue 有一个加载时间，如果不做处理，会造成vue代码未被解析前就加载出来，所以我这边结合jquery做了一个处理，首先将整个页面加上 display:none 的属性，等vue渲染结束后显示页面，如下

function removeLoading() {
    $('body').find('#load').remove();
    $('#body').show();
}

iframe 跨域的问题，使用 js 的postmessage来处理接受，代码如下

window.addEventListener('message',function(e){
    console.log('收到支付请求');
    console.log('数据' + e.data.data);
    $.ajax({
        type: "POST",
        url: "{$pay_url_html}",
        data: e.data.data,
        dataType:"html",
        success: function(data){
            $('#pay-html').empty().append(data);

        }
    });

})

js 的闭包以及方法调用，代码如下，外部直接调用闭包方法即可

var Pay = {
    "domains":"",
    "pay_html_url":"",
    "payHtml":function(config){
        var _this = this;
        var url = this.domains + this.pay_html_url + "?";
        for(var i in config){
            url += i +"="+config[i]+"&";
        }
        url = url.substring(0,url.length-1);
        console.log(url);
        //iframe中跨域通信
        post = {type:1,data:config};
        window.parent.postMessage(post,'*');
        
    },
};