javascript - 获取backgroundImage对象

我当前正在尝试获取画布实例的backgroundImage对象，但它不起作用。我得到了canvas对象的任何属性，但没有得到我当前加载的backgroundImage的属性。还有其他人知道这个问题吗？这是我所拥有的

var bgImg = canvas.setBackgroundImage(img.src, canvas.renderAll.bind(canvas), {
  width: bgWidth,
  height: bgHeight,
  originX: 'left',
  originY: 'top',
  left: 0,
  top: bgTop
});

如果我然后做类似的事情：console.log（bgImg.backgroundImage）我得到的结果为null。对于canvas元素的所有其他属性，例如，如果我想要宽度，则得到对象返回值或值-因此所有其他属性都起作用。 backgroundImage无法正常工作的原因是什么？

很感谢任何形式的帮助。

非常感谢，
迈克尔

最佳答案

这是因为当您尝试使用console.log（）进行显示时，setBackgroundImage尚未完成（异步）。

的HTML：

<canvas width="320" height="510" id="canvas"></canvas>
<button id="click">Click here !</button>

Javascript：

var canvas = new fabric.Canvas('canvas');

var img = new Image()
img.src = 'http://fabricjs.com/assets/jail_cell_bars.png';

var bgImg = canvas.setBackgroundImage(img.src, canvas.renderAll.bind(canvas), {
    width: 320,
    height: 510,
    originX: 'left',
    originY: 'top',
    left: 0,
    top: 0
});

document.getElementById("click").addEventListener("click", function () {
    console.log(bgImg.backgroundImage);
});

在此示例中，当您单击以下按钮时，会在控制台中显示canvas.backgroundImage：http://jsfiddle.net/LOLKFC/PQe5e/

关于javascript - 获取backgroundImage对象，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/23443085/