1.touchmove不能触发,touchstart,touchend可以触发
imgBox.addEventListener('touchstart',touch, false);
imgBox.addEventListener('touchmove',touch, false);
imgBox.addEventListener('touchend',touch, false);
//添加如下代码imgBox可以执行
document.addEventListener('touchmove',touch, false);
原因:元素imgBox在执行touchmove时高度为0,所以不能触发,但添加document.addEventListener后,自动触发touchmove事件,所以imgBox下的touchmove事件也能顺利进行了。
2.无缝轮播transition动画异步加载
//回缩第一张
imgBox.style.transition = "none";
obj.style.transform="translateX(0px)"
//动画下一张
imgBox.style.transition = "all 0.3s ease 0s";
obj.style.transform="translateX(-300px)"
由于动画异步加载的原因,在设置回缩后会被播放下一张的动画覆盖,因此使用如下代码,或使用jq的stop。
function tEnd(){
if (indexx >= ols.length-1) {
indexx =1;
console.log(111111)
// imgBox.style.transform = "translateX(0px)";
imgBox.style.transition = 'none'
setTransfrom(-300);
// setTransfrom(-indexx * banner.offsetWidth);
// return
}
console.log(222)
}
imgBox.addEventListener('transitionend',tEnd,false);
3.eslint不识别tab空格
4.报错Cannot assign to read only property 'exports' of object '#<Object>'
vue引入文件报错,删除.babelrc中的plugins的transfrom-runtime
5.路由路径需一一对应。
6.打包路径出错
子目录设置:
const router = new VueRouter({
mode: 'history',
base: __dirname,
routes
})