Pass function as property?

[sjorsvanheuveln]

Can I also pass a function as a property let's say something like this:

<P5Wrapper sketch={sketch} action={actionFunction} />

//sketch
export function sketch(P) {
  const p = P;

  p.setup = function (props) {
    p.createCanvas(width, height);
   props.actionFunction();
  };

  p.draw = function () {
    }
  };
}

I've tried and failed. Is it possible to do this?

[karismatic-megafauna]

Two things here:

1. in your code, this line => props.actionFunction();
   should actually be => props.action();
   this is because the prop key you are assigning actionFunction to is action.

2. even if that isn't the issue, i don't think you can access props in this way with this wrapper... (where does props come from?)

[karismatic-megafauna]

Oh, i think the answer is here => https://github.com/NeroCor/react-p5-wrapper#usage

Where it is defined:

  p.myCustomRedrawAccordingToNewPropsHandler = function (props) {
    if (props.rotation){
      rotation = props.rotation * Math.PI / 180;
    }
  };

and where it is used:

  <P5Wrapper sketch={sketch} rotation={rotation} />

notice that the name "myCustomRedrawAccordingToNewPropsHandler" is important:

in the source code, you need to call that name exactly to get rotation on your props.

[jamesrweb]

@karismatic-megafauna, @sjorsvanheuveln yeah, this is how it works from what I have seen too, I refactored some code in #48 but hoping to also edit this because it is actually implemented in such a way that it polluted the p5 namespace as you can see at index.ts line 30.

Currently I think I will propose a simple options object to be kept in state and passing down the setOptions handler for people to Lift state up and read-on-render as required. Any thoughts on this?

[jamesrweb]

Closing due to inactivity. For those viewing this issue in the future, a related PR of interest could be #65 depending how that one develops.