为什么JS draw()
方法没有在每个间隔调用该URL来切换到新的随机图像?
document.addEventListener("DOMContentLoaded", ready);
class Canvas {
constructor(height, width, hex, interval) {
this.timer = 0;
this.interval = interval ? interval : '1000';
this.color = hex ? hex : '000000';
this.canvas = document.getElementById('mainCanvas');
this.canvas.width = window.innerWidth;
this.canvas.height = window.innerHeight;
this.context = this.canvas.getContext('2d');
this.image = new Image();
var t = this;
setInterval(function () {
t.timer++;
console.log(t);
t.draw();
}, this.interval);
}
init() {
this.draw();
}
draw() {
console.log(`${window.innerWidth}x${window.innerHeight}`);
this.image.src = `https://picsum.photos/${window.innerWidth}/${window.innerHeight}`;
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height)
this.context.drawImage(this.image, 0, 0);
}
}
function ready() {
const canvas = new Canvas(null, null, 'ffcc00', 1000);
canvas.init();
}
调用draw()
时,图像src没有刷新,是否假定它是同一图像?