【前端】如何向requestAnimationFrame的回调函数中传递参数
function drawAll(ball) {ctx.clearRect(0,0,864,664);drawBorder();ball.moveBall();ctx.drawImage(ball_img,ball.location_x,ball.location_y,2*ball.ballrad,2*ball.ballrad);requestAnimationFrame(drawall);
}
预想的是向drawall这个函数中传递ball这个对象,moveball是改变ball的位置,drawimage一行是根据ball的位置绘制ball,但这样做不能成功。
我知道可以用全局变量去实现,但求教有没有向callback中传参的方法呢,尤其是未来drawAll函数可能接受多个参数的情况下。
回答
其实跟setTimeout类似,我们知道传参传的是一个函数,那么我们是不是可以用一个匿名函数来包裹这个函数的执行呢
比如:
function fn(fc){ console.log('fc:',fc)
fc++; setTimeout(function(){
fn(fc)
},1000)
}
fn(1);
function drawAll(ball) { ctx.clearRect(0,0,864,664); drawBorder(); ball.moveBall(); ctx.drawImage(ball_img,ball.location_x,ball.location_y,2*ball.ballrad,2*ball.ballrad); requestAnimationFrame(function() { drawAll(ball)
});
}
callback.bind(this,参数1,参数2)?
Function.prototype.bind()
function drawAll(ball) { function innerDrawAll(){ ctx.clearRect(0,0,864,664); drawBorder(); ball.moveBall(); ctx.drawImage(
ball_img,
ball.location_x,
ball.location_y, 2*ball.ballrad, 2*ball.ballrad
); requestAnimationFrame(innerDrawAll);
}; innerDrawAll();
}drawAll(ball);
不过要补上停止渲染的条件,有点类似递归,要有递归结束条件。类似,不是完全一样。
为什么我的审批二个小时了还没过..
不好意思啊,
借楼问个问题:
页面一div,操作transform: rotate(70deg)旋转后,
我要拖动这div,mousedown点击时,div会偏移出原来点击的位置?
这是什么原因造成的,有什么解决方法
更多相关文章
- 思索 p5.js 的最佳实践
- js变量、常量、函数类型、作用域、闭包、模板字符串
- js基础知识(变量、常量、函数、数据类型、函数声明及类型)
- 初识JS变量与常量、函数、作用域与闭包、模板字符串与标签函数
- js基础语法 变量 函数
- Vue组件为什么data必须是一个函数呢?本文案例详解
- 如何用vue-Element-ui实现左侧无限级菜单?本文详细教你
- 如何实现vue3.0的响应式呢?本文实战教你
- 解构赋值及其在函数传参中的应用