Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

[MartensCedric]

I might be doing something wrong but I cannot get this library to work

The code used:

export default class App extends Component {    
      
     handleCanvas = (canvas) => {    
     const ctx = canvas.getContext('2d');    
     ctx.fillStyle = 'purple';    
     ctx.fillRect(0, 0, 100, 100);    
    }    
      
   render() {    
     return (    
       <Canvas ref={this.handleCanvas}/>    
     )    
    }    
  }    

I'm getting this error:

Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

This is the tutorial so I'm a bit confused on why I am getting this problem