const NoLockIconURL = "./cavansIMG/NoLock.png"; const NoLockcallback = (img, isError) => { if (!isError) { fabric.Object.prototype.controls.NoLock = new fabric.Control({ // x和y设置该控制点和第二列中间的控制点重合 x: -0.5, y: -0.5, offsetX: 10, offsetY: -10, // 光标移动到该控制点时变为一个手的图标 cursorStyle: 'pointer', // 自定义的值，可忽略 actionName: "NoLock", // 设置当点击了该控制点，鼠标弹起是执行的动作处理方法 mouseUpHandler: function (eventData, target) { }, //渲染图标 render: renderIcon(img._element, 0), cornerSize: 15, borderColor: '#000', }); } }; fabric.Image.fromURL(NoLockIconURL, NoLockcallback); 怎么点击锁定不能选中

要实现点击锁定后不能选中，你可以在 `mouseUpHandler` 方法中设置 `selectable` 属性为 `false`，示例代码如下：

mouseUpHandler: function (eventData, target) {
  // 点击锁定后设置 selectable 属性为 false
  target.set('selectable', false);
  target.canvas.renderAll();
}

这样，当你点击锁定按钮后，该图形对象就无法被选中了。如果你需要再次选中该图形对象，可以将 `selectable` 属性重新设置为 `true`。

相关问题

const userParams = val => { console.log(val, 'valval') oauthId.value = val.oauthId staffName.value = val.staffName groupChatName.value = val.groupChatName } // 点击确定，创建群聊 const submit = () => { const oauthId = oauthId.value const staffName = staffName.value const groupChatMembers = data.groupChatMembers.push({ oauthId, staffName }) const operatorName = creatorName.value const groupChatName = groupChatName.value const groupChatImg = `https://uat-shr-minio.1shitou.cn:9000/llofficesystem/im/web-js/groupImg${Math.ceil( Math.random() * 7 )}@2x.png` console.log( operatorName, groupChatMembers, groupChatName, groupChatImg, 'pppp' ) conStore.createGroup( operatorName, groupChatMembers, groupChatName, groupChatImg ) if (route.path !== '/conversation') { router.push('/conversation') } close() }

这段代码中出现了一个错误。在 `submit` 函数中，你尝试使用变量 `oauthId`、`staffName` 和 `groupChatName`，但它们没有被声明。这是因为在 `submit` 函数中，你重新声明了这些变量，如下所示：

const oauthId = oauthId.value
const staffName = staffName.value
const groupChatName = groupChatName.value

这会覆盖全局作用域中的 `oauthId`、`staffName` 和 `groupChatName` 变量，而且这些变量是未初始化的。因此，在你引用它们之前，必须将它们初始化。

为了解决这个问题，你可以将这些变量命名为异于全局作用域中的变量名。例如：

const submit = () => {
  const oauthIdVal = oauthId.value
  const staffNameVal = staffName.value
  const groupChatNameVal = groupChatName.value

  const groupChatMembers = data.groupChatMembers.push({
    oauthId: oauthIdVal,
    staffName: staffNameVal
  })

  // ...
}

这样就可以避免变量重复声明的问题。

btn.onclick = function () { const img = document.createElement('img') img.src = './123.png' container.append(img) setTimeout(() => { container.removeChild(img) }, 2000) }点击多次之后，./123.png会重复请求

这种情况下，每次点击按钮时都会创建一个新的`<img>`元素并将其添加到`container`容器中，因此每次点击都会触发一次新的图片请求。由于图片加载需要一定时间，因此在两秒后通过`setTimeout`函数将该图片元素从`container`容器中移除，但这并不会阻止浏览器发出的请求。

为了避免重复请求，我们可以通过判断当前容器中是否已经存在该图片来避免重复添加。代码如下：

btn.onclick = function () {
    const img = document.createElement('img')
    img.src = './123.png'

    // 判断容器中是否已经存在该图片
    if (!container.contains(img)) {
        container.append(img)
        setTimeout(() => {
            container.removeChild(img)
        }, 2000)
    }
}

在这个修改后的代码中，我们首先使用`container.contains(img)`方法来判断当前容器中是否已经包含了该图片元素。如果已经存在，则不再重复添加；否则，再将其添加到容器中，并设置在两秒后自动移除。这样可以避免重复请求相同的图片。