Javascript 有没有办法阻止Canvas fillText函数在顶部重写？

你好，谢谢你的帮助

我正在开发一个实时PDF编辑器，用户可以在其中填写典型的表单输入，并在浏览器中看到它自动填充。它可以成功地工作，但是每次用户在字段中键入内容时，它都会一次又一次地过度写入，使其显示为粗体

下面是一个输入示例，我在其中捕获值“onkeyup”

<div class="col-12 mb-3">
     <p class="h3 mb-3 border-bottom">
          Stock
     </p
     <input class="form-control" type="text" value=""
         id="stock" onkeyup="editThisRow('stock')">
</div>

下面是我制作的一个函数，它可以清除用户编写的所有元素。它将清除表单值和画布生成的文本

 //function to clear input on form
    const clearForm = () => {
        canvas.clearRect(0, 0, canvas.width, canvas.height);
    };

下面是一个屏幕截图，您可以看到右侧的表单和左侧的PDF模板，生成的文本开始显示为粗体，因为它在每次按键时都会覆盖自身

---

在向字段中绘制文本之前，可以尝试“清除”该字段（类似于

clearForm（）

中的字段除外）。内部

editThisRow（）

“全部清除。全部重画”。

 //function to clear input on form
    const clearForm = () => {
        canvas.clearRect(0, 0, canvas.width, canvas.height);
    };