I have a utility which produces a thumbnail for a video and returns it as an HTMLCanvasElement. I'd like to render that element in React, like so:
render () {
return (
<div className='video-thumbnail'>
{this.props.videoThumbnailCanvas}
</div>
);
}
But when I try that, I get an error that:
Error: Objects are not valid as a React child (found: [object HTMLCanvasElement]).
What's a good way to do this? One idea is to do direct DOM manipulation from componentDidMount (e.g. React.getDOMNode(this).appendChild(this.props.videoThumbnailCanvas)), but that seems rather hack-like.