canvas清除画布方法

首先：定义画布长宽

 data() {
    return {
      cWidth: 1000,
      cHeight: 600,
    };
  },

1、canvas每当高度或宽度被重设时，画布内容就会被清空

  cleanCanves() {
       let canvas = document.getElementById("myCanves");
        var ctx = canvas.getContext("2d");
        canvas.height=this.cHeight;
        canvas.width=this.cWidth
}

2. 使用clearRect方法：

function clearCanvas()
{
	
       let canvas = document.getElementById("myCanves");
        var ctx = canvas.getContext("2d");
	ctx .clearRect(0,0,c.width,c.height);

 

3. 类似于方法2，可以用某一特定颜色填充画布，从而达到清空的目的：

 

function clearCanvas()
{
	let canvas = document.getElementById("myCanves");
    var ctx = canvas.getContext("2d");
	
	ctx .fillStyle="#000000";
	ctx .beginPath();
	ctx .fillRect(0,0,c.width,c.height);
	ctx .closePath();

}