【React.js】JSXでhrefの文字列と値を連結する

文字列の連結は、{‘hoge’ + value} と言うように、{}の中で連結する

render() {
    if (this.state.data) {
      return <div>
        <table class="table">
        <thead>
        <tr>
          <th scope="col">Height</th>
          <th scope="col">Time</th>
          <th scope="col">Hash</th>
        </tr>
        </thead>
        <tbody>
          {this.state.data.map((value) => (
            <tr>
              <th scope="row"><a href={'/data/' + value.height} >{value.height}</a></th>
              <td>{value.time}</td>
              <td>{value.hash}</td>
            </tr>
          ))}
        </tbody>
        </table>
      </div>
    }
    else {
      return <div>Loading...</div>
    }
  }

リンクは以下のように設定されます
http://***/data/1

ここに辿り着くまでに結構時間かかりました… OK