【React, SemanticUI】チェックボックスからon以外の情報を取得する方法

チェックボックスを使いTrue/Falseの値を取得したい。
そんなときに、↓のようにかいたところうまく値が取得できませんでした。

<div class="ui checkbox">
  <input id="example-id" name="sample" type="checkbox">
  <label for="example-id">Label</label>
</div>

$('.ui.checkbox').checkbox({
  onChange: () => {
    this.setState({ sample: $("input[name=samle]").val()});
  }
});

なんとなくこんな感じでうまくいくんじゃないかと思ったけど、全然甘かったです。。ただ、↓のように書き直すとチェックがあるたびに、チャックあり = true, チェックなし = false の値を取得することができます。

$('.ui.checkbox').checkbox({
  onChange: () => {
    this.setState({ sample: $("input[name=samle]").is(":checked")});
  }
});

出来上がったコードをみると確かに...ってなります。
あと、チェックボックスの動作を調べていて初めて知ったことは、チェックがないときはサーバーにデータが送られないということ。
恥ずかしながら今まで知りませんでした。。（今回の場合は関係ないけど）

一応Semanticの公式URLを添付しておきます。

ただ日々を記すもの