如何在React中使用注释

如何在React组件的渲染方法中使用注释?

我有以下组件:

'use strict';
 var React = require('react'),
   Button = require('./button'),
   UnorderedList = require('./unordered-list');

class Dropdown extends React.Component{
  constructor(props) {
    super(props);
  }
  handleClick() {
    alert('I am click here');
  }

  render() {
    return (
      <div className="dropdown">
        // whenClicked is a property not an event, per se.
        <Button whenClicked={this.handleClick} className="btn-default" title={this.props.title} subTitleClassName="caret"></Button>
        <UnorderedList />
      </div>
    )
  }
}

module.exports = Dropdown;

我的评论显示在UI中。

在组件的呈现方法中应用单行和多行注释的正确方法是什么?

当前回答

根据官方网站，这是两种方式:

<div>
  {/* Comment goes here */}
  Hello, {name}!
</div>

第二个例子:

<div>
    {/* It also works 
    for multi-line comments. */}
    Hello, {name}! 
</div>

参考资料如下:如何在JSX中编写注释?

2019-11-22 04:21:03

其他回答

总而言之，JSX不支持注释，无论是类似html的还是类似js的:

<div>
    /* This will be rendered as text */
    // as well as this
    <!-- While this will cause compilation failure -->
</div>

在JSX中添加注释的唯一方法实际上是逃到JS中并在那里添加注释:

<div>
    {/* This won't be rendered */}
    {// just be sure that your closing bracket is out of comment
    }
</div>

如果你不想做些无聊的事

<div style={{display:'none'}}>
    actually, there are other stupid ways to add "comments"
    but cluttering your DOM is not a good idea
</div>

最后，如果你确实想通过React创建一个注释节点，你必须更加花哨，看看这个答案。

2019-01-21 19:03:57

{
    // Any valid JavaScript expression
}

如果您想知道为什么它可以工作，那是因为大括号{}内的所有内容都是JavaScript表达式。

所以这也很好:

{ /*
         Yet another JavaScript expression
*/ }

2018-08-06 19:47:05

根据官方网站，这是两种方式:

<div>
  {/* Comment goes here */}
  Hello, {name}!
</div>

第二个例子:

<div>
    {/* It also works 
    for multi-line comments. */}
    Hello, {name}! 
</div>

参考资料如下:如何在JSX中编写注释?

2019-11-22 04:21:03

在React Native中添加注释的两种方法

//(双正斜杠)只用于注释React Native代码中的一行，但它只能在渲染块之外使用。如果您想在我们使用JSX的呈现块中注释，则需要使用第二种方法。如果你想在JSX中注释一些东西，你需要在花括号内使用JavaScript注释，如{/* comment here /}。它是一个常规的/ Block注释*/，但它需要用大括号括起来。

/*块注释*/的快捷键:

Windows和Linux下按Ctrl + /。 Cmd + /在macOS上。

2019-08-05 14:10:56

根据React的文档，你可以像这样在JSX中编写注释:

单行注释:

<div>
  {/* Comment goes here */}
  Hello, {name}!
</div>

多行注释:

<div>
  {/* It also works 
  for multi-line comments. */}
  Hello, {name}! 
</div>

2019-08-28 05:05:29

如何在React中使用注释

推荐文章

最新文章

标签