Textarea自闭标签？ <文本区域 />答案

【问题标题】：Textarea self closing tag? <textarea />Textarea自闭标签？ <文本区域 />
【发布时间】：2020-07-02 06:04:04
【问题描述】：

我最近在 youtube 上观看了一些关于为 Freecodecamp 挑战构建简单的 React Markdown 预览器的教程。然而，到目前为止我看到的教程在反应代码中添加了这个标签<textarea />，而不是<textarea></textarea>。

我查找了有关 <textarea> 标签和 w3schools、mdn 网络文档的更多信息，并且很少有其他网站仍然显示带有结束标签 </textarea> 的 <textarea>，原因是它充当了这些东西的容器在<textarea> 标签内。并且以不同的形式使用它会破坏代码。

无论如何，我想知道在 React 框架中是否仍然需要使用像这样的自关闭方法：<textarea />？我只是想弄清楚我是否需要在我正在编码的项目中使用<textarea />，或者它是否是不好的编码/实践。

【问题讨论】：

HTML 规范规定了哪些标签可以省略其结束（或开始）标签。根据 MDN 文档，textarea 不是其中之一。请参阅技术摘要。 developer.mozilla.org/en-US/docs/Web/HTML/Element/…

【解决方案1】：

在 React 中，textarea 已被修改，因此它可以像其他输入一样工作。该值通常是 HTML 中的子元素，在 React 中是一个属性

<textarea value={this.state.value} onChange={this.handleChange} />

【讨论】：

【解决方案2】：

对于 React，它主要是一种约定。如果组件内没有内容（子项），则一种惯例是始终使用自闭合标签。所以对于 textarea 它会自动关闭。

【讨论】：

【解决方案3】：

它不是 React 中的 HTML。它是 JSX。如果元素中没有子元素，只需使用 self 关闭标签。如果元素中有子元素，则使用单独的关闭标记。

您可以使用此网站查看它如何将 HTML 转换为 JSX - https://magic.reactjs.net/htmltojsx.htm

【讨论】：