gpt4 book ai didi

javascript - 允许文本区域 Web 组件接受内部文本

转载 作者:行者123 更新时间:2023-12-01 00:20:39 26 4
gpt4 key购买 nike

我正在构建一个使用 <textarea> 的 Web 组件元素,但我无法弄清楚如何让它接受像原生 <textarea> 这样的内部文本元素。

<body>
<textarea>this works</textarea>
<expanding-textarea>this doesn't</expanding-textarea>
<script type="module">
const template = document.createElement("template");
template.innerHTML = `<textarea></textarea>`;

class ExpandingTextarea extends HTMLElement {
constructor() {
super();
this.attachShadow({ mode: "open" });
this.shadowRoot.appendChild(template.content.cloneNode(true));
}
}
customElements.define("expanding-textarea", ExpandingTextarea);
</script>
</body>

最佳答案

您需要在构造函数中设置新创建的文本区域的textContent 属性。我为你做了一个简化版本。

class ExpandingTextarea extends HTMLElement {
constructor() {
super();
this.attachShadow({ mode: "open" });
var textarea = document.createElement("textarea");
textarea.textContent = this.textContent;
this.shadowRoot.appendChild(textarea);
}
}
customElements.define("expanding-textarea", ExpandingTextarea);

关于javascript - 允许文本区域 Web 组件接受内部文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59455788/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com