P5-wrapper/react

TypeError: Cannot read property 'random2D' of undefined

mozgbrasil opened this issue · 2 comments

Good morning my friends

How to use the Vector method, see that in the sketch argument an object is returned and not the p5 function that has the Vector method

= This Work

import React from "react";
import ReactDOM from "react-dom";
import P5Wrapper from "react-p5-wrapper";

export function sketch(p5) {
//   let v1 = p5.Vector.random2D();
p5.setup = () => {
    console.log("p.setup");
};
p5.draw = () => {
    console.log("p.draw");
    p5.background(240);
};
}

const App = () => {
return (
    <>
    <div>App Hello World!</div>{" "}
    <div id="container_3d" className="center">
        <P5Wrapper sketch={sketch} />
    </div>
    </>
);
};

ReactDOM.render(<App />, document.getElementById("root"));

= This Not Work

import React from "react";
import ReactDOM from "react-dom";
import P5Wrapper from "react-p5-wrapper";

export function sketch(p5) {
console.log("typeof p5", typeof p5); // Not is a Function ???
console.log("p5", p5);
let v1 = p5.Vector.random2D(); // Error: index.js:6 Uncaught TypeError: Cannot read property 'random2D' of undefined
p5.setup = () => {
    console.log("p.setup");
};
p5.draw = () => {
    console.log("p.draw");
    p5.background(240);
};
}

const App = () => {
return (
    <>
    <div>App Hello World!</div>{" "}
    <div id="container_3d" className="center">
        <P5Wrapper sketch={sketch} />
    </div>
    </>
);
};

ReactDOM.render(<App />, document.getElementById("root"));

Captura de tela de 2020-03-12 19-14-02
Captura de tela de 2020-03-12 19-18-40

Hi @mozgbrasil the p5 that gets passed into the module isn't the same as the global p5 you traditionally get with a script tag. To access certain things with this package (due to the p5 node module itself) you need to use p5.constructor.[something], in your case p5.constructor.Vector.random2D() will get you what you need.

Closing issue due to inactivity.