如何在 SVG 中通过 TypeScript 设置 TextArea.innerHTML

Question

这是我尝试使用 TypeScript 重新创建的一些 SVG 代码。

<svg>
    <switch>
        <g requiredFeatures="http://www.w3.org/Graphics/SVG/feature/1.2/#TextFlow">
            <textArea width="200" height="auto">
            Text goes here
            </textArea>
        </g>
        <foreignObject width="200" height="200" 
        requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
            <p xmlns="http://www.w3.org/1999/xhtml">Text goes here</p>
        </foreignObject>
        <text x="20" y="20">No automatic linewrapping.</text>
</switch>

在大多数情况下，我都能正常工作，但是我不确定如何将文本插入到 TextArea（和文本）元素中。这是我想要做的：

const textArea = document.createElementNS(this.xmlns, 'textArea');
textArea.setAttributeNS(null, 'width', '200');
textArea.setAttributeNS(null, 'height', 'auto');
//textArea.setAttributeNS(null, 'value', text);
textArea.innerHTML('Text goes here');

TypeScript 根本不喜欢 innerHTML 语句。它给了我错误： 无法调用类型缺少调用签名的表达式。类型 'String' 没有兼容的调用签名。

我不确定这是什么意思，我该如何解决？我在某处看到一个 post 说只是将 "value" 设置为文本，我试过了，但在那种情况下它不显示文本，它只是成为另一个参数。

提前感谢您提供的任何建议。

Answer 1

innerHTML 是一个 string property （不是函数），所以你可以这样设置它：

textArea.innerHTML = 'Text goes here';

demo

如何在 SVG 中通过 TypeScript 设置 TextArea.innerHTML

How to set TextArea.innerHTML via TypeScript in SVG

svg

textarea

typescript