fabric.js 中 itext 的 maxlength 属性

Question

是否有使用 fabric.js 库的 itext 的 maxlength 属性？如果不是，如何编写一个与 html/javascript maxlength 属性一样流畅和一致的代码？我一直在研究一个，但它不像 maxlength 属性那样流畅。我的问题是它会添加字符然后删除它，所以用户可以看到它发生......不像 maxlength 属性它只是停止接受输入。

Answer 1

您可以添加maxlength到hiddenTextarea文本对象editing:entered事件。

const canvas = new fabric.Canvas('c');

const text = new fabric.IText('Hello');

text.on('editing:entered', () => {

  text.hiddenTextarea.setAttribute('maxlength', 5);

})

canvas.add(text);

canvas {

  border: 1px solid #999;

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/3.4.0/fabric.js"></script>

<canvas id="c" width="600" height="600"></canvas>