Make an API call to dynamically create checkboxes

问题:

I am trying to create checkboxes dynamically in my application. My API call returns following response:

"attendee_types": [
    {
        "checked": false,
        "attendee_type": "seller"
    },
    {
        "checked": false,
        "attendee_type": "buyer"
    }
]

Using this data i am creating a state property checkboxes. On returning this, i am getting the error: Objects are not valid as a React child (found: object with keys {checked, attendee_type}) because my checkboxes is an object.

Method to render checkboxes:

renderCheckboxes() {
    const {checkboxes} = this.state;

    return _.map(checkboxes, (checkbox,index) => {
      return (
        <label key = {checkbox.attendee_type} className="col-sm-6">
          <input
              type="checkbox"
              name="attendee_type"
              className=""
              changed={checkbox.checked}
              onChange={this.toggleCheckbox.bind(this, index)}
          />
          {checkbox}
        </label>
      );
      })
    }

Render Method:

return (
        <form onSubmit={handleSubmit(this.onSubmit.bind(this))}>
              <div className="attendee-type">
                {this.renderCheckboxes()}
              </div>
        </form>
  )

Any leads?

Thanks in Advance, Forum