reactjs – 为什么我在元素标记内没有JSX注释?

前端之家收集整理的这篇文章主要介绍了reactjs – 为什么我在元素标记内没有JSX注释?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我遵循将多属性标签分解为多行的常见模式,例如.
<div
  className="foo"
  style={{ fontWeight: "bold" }}
/>

我想在声明中添加一条评论,例如.

<div
  className="foo"
  {/* This is only temporary */}
  style={{ fontWeight: "bold" }}
/>

但是上面的语法不起作用;我明白了:

SyntaxError: Unexpected token,expected ... (45:96)

(指向临时* /}中的结束}.)
是否可以在JSX中的标记添加注释,如果是,我应该使用什么语法?

简短的回答是“你不能”,但有各种方法来伪造它.我认为最简单的方法是捎带另一个值:
<img
  alt={"settings link"
  /* This is just temporary */}
  src="http://www.example.com/foo.jpg"
/>

它有点不太清晰,但我们所做的就是将支撑向上移动一行.这将“设置链接”从HTML格式的JSX值转换为Javascript表达式,恰好有一个注释.

它的优势在于它将注释与单个属性相关联,而不是整个标记.我认为这更清楚;如果你真的想对标签发表评论,你最好把它移到顶部.

如果你的目标是评论一些属性,是的,这有点模糊.但是当你解决它时,它应该足够明确地取消评论.

猜你在找的React相关文章