How to access canvas context in React

Question

I made a color picker with React and Canvas. Currently the components are rendered in React and canvas is done with vanilla javascript. I\'d like to two to mesh more, so I w

Answer 1

You can add a ref function attribute on the canvas element:

 this.context = c.getContext('2d')} height="...

Then you’ll have access to the context through this.context:

colorStripClick: function() {
    var imageData = this.context.getImageData(x, y, 1, 1).data
}

You can also use the event object to access to DOM node as already pointed out, but this way you’ll have access from anywhere, not just event handlers.