Reactでコメントを使用する方法 質問する

Reactでコメントを使用する方法 質問する

renderReact コンポーネントのメソッド内でコメントを使用するにはどうすればよいですか?

次のコンポーネントがあります:

'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 に表示されます。

コンポーネントのレンダリング メソッド内に 1 行および複数行のコメントを適用する適切な方法は何でしょうか?

ベストアンサー1

メソッド内ではrenderコメントが許可されていますが、JSX 内でコメントを使用するには、コメントを中括弧で囲み、複数行スタイルのコメントを使用する必要があります。

<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>

JSXでのコメントの仕組みについて詳しくはこちらをご覧ください。ここ

おすすめ記事