从本地存储将dataURL加载到HTML Canvas中

Question

我从本地存储区将dataURL加载到画布中时遇到了一些麻烦。

localStorage.getItem(canvasArea)

我设法将dataURL保存到本地存储中，当我进行console.log注销时，可以查看它：

我设法通过使用以下代码来保存它：

document.getElementById("saveButton").addEventListener("click", function()
{  
   var canvas = document.getElementById("canvasArea"),
   ctx = canvas.getContext("2d");

   localStorage.setItem(canvasArea, canvas.toDataURL());
})

但是，当我尝试使用下面的代码放置该dataURL时，它不会执行任何操作。

function loadCanvas(dataURL) {

    var canvas = document.getElementById('canvasArea');
    var ctx = canvas.getContext('2d');


    var imageObj = new Image();
    imageObj.src = dataURL;
    imageObj.onload = function() {
      ctx.drawImage(this, 0, 0);
    };  
}

var dataURL = localStorage.getItem(canvasArea);
loadCanvas(dataURL);

我缺少明显的东西还是我很愚蠢？ 任何帮助，将不胜感激！ 谢谢！

Answer 1

在localStorage.getItem(canvasArea)上执行console.log并确切地看到它正在得到什么。 在需要loadCanvas(""+ dataURL);之前，我遇到过类似的怪异问题loadCanvas(""+ dataURL); 而不是loadCanvas(dataURL);