Hello, thanks so much for this constructive document answer. I am new to react and i am developing a project with my friends. I have a doubt regarding the same topic. is there a way to do this as a functional component?
import React, { useEffect } from 'react'; import p5 from 'p5';
const App = () => {
const myRef = React.createRef();
const Sketch = (p) => {
p.setup = () => { p.createCanvas(300, 200); p.noStroke(); } p.draw = () => { p.background('orangered'); p.ellipse(150, 100, 100, 100); }
}
useEffect(() => { const myP5 = new p5(Sketch, myRef.current) },[])
return ( <div ref={myRef}> Hello </div> )
export default App;
Thanks for the response @anshul16. It will surely help someone in the community.
Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment's permalink.
Hide child comments as well
Confirm
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Hello, thanks so much for this constructive document answer. I am new to react and i am developing a project with my friends. I have a doubt regarding the same topic. is there a way to do this as a functional component?
import React, { useEffect } from 'react';
import p5 from 'p5';
const App = () => {
const myRef = React.createRef();
const Sketch = (p) => {
}
useEffect(() => {
const myP5 = new p5(Sketch, myRef.current)
},[])
}
export default App;
Thanks for the response @anshul16. It will surely help someone in the community.