Function with arguments in requestAnimationFrame

Question

I'm trying to define a recursive function with arguments using "requestAnimationFrame".

animate(frameElapsed,points,canvas){
        console.log("test");
        if(frameElapsed<points.length-1){ 
            requestAnimationFrame(this.animate(frameElapsed+1,points,canvas));
        }
        ...
}

When I do this, i get the error "Argument of type 'void' is not assignable to parameter of type 'FrameRequestCallback'. So I tried to define an anonymous function that calls animate to solve this problem.

animate(frameElapsed,points,canvas){
        console.log("test");
        if(frameElapsed<points.length-1){ 
            requestAnimationFrame(function() {
                this.animate(frameElapsed+1,points,canevas);
            }); 
        }
        ...
}

Then, I get "ERROR TypeError: Cannot read property 'animate' of undefined" in my web console. I can't manage to solve this problem.

Is there a way to pass arguments to af function called back by requestAnimationFrame ?

Thank you for your help !

Does this answer your question? [How can I pass argument with requestAnimationFrame?](https://stackoverflow.com/questions/19893336/how-can-i-pass-argument-with-requestanimationframe) — Kaiido, Jun 25 '20 at 03:30
the call to this is wrapped in another function call. this does not refer to the object containing animate. You need to rebind this, expose this to the scope, or reference to animate directly. — user120242, Jun 25 '20 at 04:45
`requestAnimationFrame(function() {` to `requestAnimationFrame(()=> {` — user120242, Jun 25 '20 at 04:50

score 3 · Accepted Answer · edited Jun 26 '20 at 09:11

3

user120242's solution worked for me !

    animate(frameElapsed, points, canvas) {
        console.log("test");
        if(frameElapsed < points.length - 1) { 
            requestAnimationFrame(() => {
                this.animate(frameElapsed + 1, points, canvas);
            }); 
        }
        ...
    }

Thank you for your help !

edited Jun 26 '20 at 09:11

Community

1
1

answered Jun 25 '20 at 09:08

Valter

63
9

Function with arguments in requestAnimationFrame

1 Answers1