我正在使用fabric.js,并且在某一时刻我使用了以下代码:
canvas.on("object:modified", (opt) => {
console.log(opt.action); //="scale"
handleScaled(opt);
});
但是在handleScaled函数中opt.action未定义:
function handleScaled(opt) {
console.log(opt.action) //=undefined
console.log(opt) //displays the whole opt object but there is no "action" in it
//further handleScaled code
}
console.log(opt.action) 在函数调用之前会正确显示“scale”,但是当我在 handleScaled 中调用相同的内容时,opt.log(opt.action) 会正确显示“scale”。操作未定义。
为什么opt.action似乎不存在于被调用函数的范围内,但却恰好在调用之前存在?
正确的工作代码仅在操作为“scale”时调用handleScale:
canvas.on("object:modified", (opt) => {
if (opt.action === "scale") {
handleScaled(opt);
}
}); Copyright 2014-2025 //m.sbmmt.com/ All Rights Reserved | php.cn | 湘ICP备2023035733号
在您的代码中,当您在调用
handleScaled函数之前记录opt.action时,它会正确显示“scale”,因为它正在访问action传递给canvas.on事件处理程序的回调函数中opt对象的 code> 属性。当您在handleScaled函数中记录opt.action时,它显示为undefined,因为opt对象被传递给handleScaled函数是该对象的另一个实例。它没有action属性,因为它与之前记录的opt对象不同。要使
opt.action可以在handleScaled函数中访问,您可以像这样修改代码:canvas.on("object:modified", (opt) => { console.log(opt.action); //="scale" handleScaled(opt); }); function handleScaled(opt) { console.log(opt.action); // "scale" (should display correctly) // further handleScaled code }通过将
opt对象直接传递给handleScaled函数,您可以在函数作用域内保留对其属性的访问权限。确保传递给handleScaled的opt对象包含预期的action属性。