JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="c" width="200" height="200"></canvas>
<br/>
<button onclick='resizeCanvas(100);return false;'>Resize</button>

CSS

canvas {border: 1px solid black}

JavaScript

var c = document.getElementById('c');
var cc = c.getContext('2d');
cc.beginPath();        
cc.rect(20, 20, 20, 12);
cc.fill();

function resizeCanvas(size){
    var c = document.getElementById('c');
    var cc = c.getContext('2d');
    // This will make the content disappear
    c.width = c.style.width = c.height = c.style.height = size;
}