DataviewJS 中使用 textarea 元素时因未知原因造成 Obsidian 无响应

我在 DataviewJS 中创建了一个通过填写表单绘制图像的小程序。在使用 textarea 元素输入数据时由于未知原因造成整个 Obsidian 卡住。在开发者工具终端没有任何输出。任务管理器中没有发现资源异常占用。

下面的代码可以正常执行,且所有 input 元素工作正常。向 textarea 输入文本时 Obsidian 无响应,切换窗口离开焦点可以恢复正常。

我希望请教这一异常的原因和解决方案。

const viewBox = dv.el("div","");
const blockL = document.createElement("div");
const blockR = document.createElement("div");
const title = document.createElement("span");
const 数据输入框 = document.createElement("textarea");
const 按钮 = document.createElement("button");

function createInput(label, callback) {
    const box = document.createElement("div");
    const promptText = document.createElement("span");
    const input = document.createElement("input");
    box.style.display = 'flex';
    box.style.flexDirection = 'row';
    box.style.justifyContent = 'space-between';
    box.appendChild(promptText);
    box.appendChild(input);
    promptText.textContent = label;
    input.addEventListener('input', () => {
        callback(input.value)
    });
    return box;
}

function createForm(elements) {
    const box = document.createElement("div");
    box.style.display = 'flex';
    box.style.flexDirection = 'column';
    box.style.border = '2px solid white';
    for (let i in elements) {
        box.appendChild(elements[i]);
    }
    return box
}

// 配置框架设置区
let 框架设置区 = createForm([
    createInput("框架颜色设置",()=>{}),
    createInput("框架圆角设置",()=>{}),
    createInput("框架尺寸设置",()=>{})
]);

// 配置文本设置区
let 文本设置区 = createForm([
    createInput("颜色",(value)=>{}),
    数据输入框
]);

(function() {
    // 绘制主要视图框架
    viewBox.innerHTML = null;
    viewBox.style.display = 'flex';
    viewBox.style.flexDirection = 'row';
    viewBox.style.alignItems = 'stretch';
    viewBox.appendChild(blockL);
    viewBox.appendChild(blockR);
    
    // 绘制左侧选单区域
    blockL.style.display = 'flex';
    blockL.style.flexDirection = 'column';
    blockL.style.borderRadius = '15px'; // 设置圆角
    blockL.style.padding = '5px'; // 设置内部填充距离
    blockL.style.backgroundColor = '#444444';
    
    title.textContent = "title";
    blockL.appendChild(title);
    blockL.appendChild(框架设置区);
    blockL.appendChild(文本设置区);
    blockL.appendChild(按钮);
})();

image

试了下没复现 “使用 textarea 元素输入数据时卡住”

考虑造个新库专门安装 dataview 试试? (我的测试库里, 可能也有大量不知道啥来源的脚本片段, 我都快分不清了…)