首页 > 解决方案 > fabric.js 中 itext 的 maxlength 属性

问题描述

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

标签: javascriptfabricjsmaxlength

解决方案


您可以添加maxlengthhiddenTextarea文本对象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>


推荐阅读