Dynamically create buttons in react native

Question

I want to create a checkbox dynamically according to the data in API and then call the function inside my render function.

Can anyone suggest me any way, as I had used forEach but the data seem do not passed and hence I'm getting an error: forEach is undefined .

My snippet:

sizel=()=> this.state.data.sizes.forEach(function(size){
    <CheckBox
     title={size}
   checked=''
   />
 })

Answer 1

check data.sizes has length also should not be undefined.

add this:

const { sizes } = this.state.data;
if( sizes && sizes.length){
 this.state.data.sizes.map(size => <CheckBox title={size} checked=''/> )
}

Answer 2

You need to add a validation before invoking forEach method, just like this:

   sizel = () => this.state.data && this.state.data.sizes && this.state.data.sizes.forEach(function (size) {
    return (
      <CheckBox
        title={size}
        checked=''
      />
    )
  })