AlloyTouch最小高度 怎么计算 about phytouch HOT 30 CLOSED

不会啊，在IOS 或者 安卓上面，如丝般顺滑，不会卡顿，我加载了1万条数据都不会卡

from phytouch.

1. https://github.com/AlloyTeam/AlloyTouch/wiki/kandian
2. 追求极致性能请使用 alloytouch.css.js

from phytouch.

是用的alloytouch.css.js +transform.js

from phytouch.

@havingmeaning 你是怎么写， 我用vue 写的，越往后 越卡，我不知道哪里 写的有问题

from phytouch.

有没有demo 参考一下

from phytouch.

http://syw3717290001.my3w.com/dist/index.html
密码bedroom222; 这个是P7的项目，玩一下哈，我用的就是 这个插件，非常好用，如丝般顺滑！

from phytouch.

简直完美，我考这个插件和这个项目，工资涨了好多

from phytouch.

@havingmeaning git 有源码没 给我看看呗

from phytouch.

@havingmeaning 不抢你饭碗 我们隔的远

from phytouch.

嘿嘿，想得美

from phytouch.

那你觉得 我这个越往后面越卡 是哪里的出的问题

from phytouch.

http://whd.liangjiang.gov.cn/WHDWechat/#/communication/?id=53
你试试

from phytouch.

你用的是不是，vue那一套，建议直接使用 js那一套

from phytouch.

建议不要用vue解决方案

from phytouch.

//配置
var munFix = $("#munFix");
var footerTab = document.querySelector("#footerFix");
var scroller = document.querySelector("#target");
Transform(scroller, true);
window.alloyTouch1 = new AlloyTouch({
touch: "#content",//反馈触摸的dom
vertical: true,//不必需，默认是true代表监听竖直方向touch
target: scroller, //运动的对象
property: "translateY",
maxSpeed: 1.8,
sensitivity: 1,//不必需,触摸区域的灵敏度，默认值为1，可以为负数
factor: 1,//不必需,表示触摸位移与被运动属性映射关系，默认值是1
min: 0,
max: 0,
touchStart: function () {
window.alloyTouch1.reastMin();
},
lockDirection: false
});

from phytouch.

//最小高度
window.alloyTouch1.reastMin= function () {
if($('#target').outerHeight() <= window.innerHeight){
alloyTouch1.min = 0;
}else{
alloyTouch1.min = -1 * parseInt(getComputedStyle(scroller).height) + window.innerHeight - 30;
}
};
document.addEventListener("touchmove", function (evt) {
evt.preventDefault();
}, false);

from phytouch.

//change
window.alloyTouch1.change=function (v) {
console.log(v);
var _self=this;
if(v >= 0){
tipNews.addClass('none');
tipNews.data('num', 1);
$(".show-text-new").text(1);
}
if (v <= _self.min + 5 && !loading) {
loading = true;
vm.infiniteData(WHD.ApiAddress.GetPostComments, couData,function (items) {
if(items === [] || items.length <= 0) {
$('.loading-more').text('没有数据了').removeClass('none');
return false;
}else{
$('.loading-more').text('正在加载中 ...').removeClass('none');
}
vm.infiniteArr=vm.infiniteArr.concat(items);
loading = false;
_self.reastMin();
couData.page++;
});
}
if (v < -100) {
if (v < -180) v = -180;
comFixedTop.translateY = v / 1.8;
comFixed.translateY = v / 1.8;
shareBtns.translateY = -v / 1.8;
}else{
comFixedTop.translateY = v / 1.8;
comFixed.translateY = v / 1.8;
shareBtns.translateY = -v / 1.8;
}

        };
    };

from phytouch.

我是直接引用的

from phytouch.

目测是这个：
vm.infiniteArr=vm.infiniteArr.concat(items);
loading = false;
_self.reastMin();
couData.page++;
});
考虑以下几点原因： vue在渲染的时候，你这个是直接覆盖这个数组，当这个数组的数据越来越多的时候，vue渲染的dom就会越来越慢，就导致你越来月卡，建议使用 push的方式
温馨提示：这个和插件本身无关！

from phytouch.

那 我试试 谢谢大哥，你先别走

from phytouch.

这样就成了二维数组了

from phytouch.

刚才去吃饭了

from phytouch.

哦，我知道为啥，你会卡了，全部在这个数组里面

from phytouch.

全在这个数组里面，是什么意思

from phytouch.

@havingmeaning 大哥 是哪里问题呀

from phytouch.

@havingmeaning 在没 ， 我这次（就加载一次）一次性加载了100条数据， 依然很卡

from phytouch.

@havingmeaning 不过去掉 里面的的子元素或者 限制 只加载20条 ，就不会卡了 ，怎么回事

from phytouch.

妹子，电脑也是人啊，超负荷之后，就傻了...

from phytouch.

就100条而已 又不多

from phytouch.

困扰我多天的 顿卡 ，终于发现问题了；
html {
/* -ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box */
}

,:after,:before {
/ -ms-box-sizing: inherit;
-o-box-sizing: inherit;
box-sizing: inherit */
}
去掉这玩意 就不卡了

from phytouch.