のえら

技術備忘とかメモとか.間違いはつっこんでいただきたい所存.アフィリエイトはやっていません.

react というか JSX のコメントアウト

プログラミング メモ

sample.html

<!DOCTYPE html>
<html lang="ja">
  <head>
    <script src="http://fb.me/react-0.13.3.js"></script>
    <script src="http://fb.me/JSXTransformer-0.13.3.js"></script>
  </head>
  <body>
    <div id="app"></div>
    <script type="text/jsx">
      // コンポーネント宣言
      var Counter = React.createClass({
        // 初期値設定
        getInitialState() {
          return { count: 0 };
        },  
        // クリック時の処理
        onClick() {
          this.setState({count: this.state.count + 1});
        },  
        // コンポーネントを返す
        render() {
          return (
            <div>
              {// state の count を読み込む
              }   
              <div>count:{this.state.count}</div>
              {/* 
                クリック時にクリックイベント呼び出し
              */}                                                                                                                                      
              <button onClick={this.onClick}>click!</button>
            </div>
          );  
        }   
      }); 
      // 描画
      React.render(<Counter />, document.getElementById('app'));
    </script>
  </body>
</html>

こんな感じで、
{// ... }
か
{/* ... */}
で書ける。

前者は終わりの } を改行しないとエラーになるので注意する。
sample.html をブラウザで開いてデベロッパーツールで確認すると、改行していない場合以下のようなエラーがコンソールに表示されている。

Uncaught Error: Parse Error: Line 18: Unexpected token {
at file:///Users/xxx/work/sample.html

{/*
^
at file:///Users/xxx/work/sample.html

{/*
^