I receive "Error: React.Children.only expected to receive a single React element child." with TouchableWithoutFeedback

Question

I receive the following error:

Error: React.Children.only expected to receive a single React element child.

When I use the 'TouchableWithoutFeedback' component with ReactNative:

 return (
    <TouchableWithoutFeedback onPress={() => {
      Keyboard.dismiss();}}>
      <View style={styles.container}>
        <Header />
        <Exercises exercises={exercises} handleChange={handleChange} handlePress={handlePress} exercise={exercise}/>
      </View>
`    </TouchableWithoutFeedback>
  );

I am not sure why because everything is wrapper in a View component. Any advice?

Answer 1

Try wrapping the content of View with a react fragment:

 return (
    <TouchableWithoutFeedback onPress={() => {
      Keyboard.dismiss();}}>
      <View style={styles.container}>
       <>
        <Header />
        <Exercises exercises={exercises} handleChange={handleChange} handlePress={handlePress} exercise={exercise}/>
       </>
      </View>
`    </TouchableWithoutFeedback>
  );