Ad

Why Can't A React Stateless Function Return An Array?

- 1 answer

Here's my stateless function that tries to return an array of elements:

function DeliveryPreference (props) {
  return [
      <h4>
        Delivery Preference
        </h4>,
        <div className='yesNoCheckbox'>
          <input type="radio" value={'tube'} onChange={props.onChange} id='tube' checked={props.value === 'tube'}/> <label htmlFor='tube'>Tube</label> <br/>
          <input type="radio" value={'plate'} onChange={props.onChange} id='plate' checked={props.value === 'plate'}/> <label htmlFor='plate'>Plate</label><br/>
        </div>
  ];
}

Can anyone explain why I can't do that, and/or provide a work-around?

Thanks very much!

Edit: Here's a minimal example of the error:

function App (props) {
    return [
    <div>1</div>,
    <div>2</div>,
    ]
}


ReactDOM.render( 
    <App/>
    , document.getElementById('root')
);
Ad

Answer

Now you can return an array , try out the React 16 Beta

Ad
source: stackoverflow.com
Ad