JSFiddle - React, Tailwind, and code Playground

HTML

<div class="col-md-4">
  <label>Required?</label>
  <input type="checkbox" name="" class="form-control required_field">
  <input type="hidden" name="field_required[]" value="">
</div>

JavaScript

$('div').on('click', '.required_field', function() {
  let v = !($(this).siblings('input').val());
  $(this).siblings('input').val(v);
  console.log($(this).siblings('input').val());
});