Javascript Fabricjs阻止在画布边界之外自由绘制

如何防止用户在自由绘图模式下在画布外绘图

用户无法从外部开始绘图，但可以从内部开始绘图，将鼠标拖动到画布外部，然后返回内部并释放鼠标按钮

部分线条将在画布外部绘制。 当鼠标移到画布外时，如何告诉织物停止绘制

我试过这个：

_onMouseOut(e) {
  if(this.canvas.isDrawingMode) {
    this.canvas.trigger('mouse:up');
    this.canvas.isDrawingMode = false;
  }
}

不起作用。这是：

_onMouseOut(e) {
  if(this.canvas.isDrawingMode) {
    this.canvas.freeDrawingBrush.onMouseUp();
    this.canvas.isDrawingMode = false;
  }
}

事情变得很糟糕

从

mouse:move

返回false也不会对此产生影响

更新：这几乎奏效了，但它仍然有效

_onMouseOver(event) {     

  if (Util.isDefined(this.canvas.__isDrawingMode)) {
    this.canvas._isCurrentlyDrawing = true;
    delete this.canvas.__isDrawingMode;
  }
}

_onMouseOut(e) {
  if(this.canvas.isDrawingMode) {
    this.canvas.__isDrawingMode = this.canvas.isDrawingMode;
    this.canvas._isCurrentlyDrawing = false;
    // this.canvas.isDrawingMode = false;
  }
}

UPDATE2:尝试了

clipTo

，但在使用

setDimensions（{}，cssOnly:true）缩放的画布上无法正常工作

    this.canvas.clipTo = (ctx) => {
      ctx.rect(0, 0, this.canvas.getWidth(), this.canvas.getHeight());
    };