react-native cómo agregar una imagen y presionar en táctil

Tengo touchable en reaccionar nativo, dentro de touchable tengo imagen y en prensa como esta

 <TouchableHighlight >
  <Image style={styles.imagestyle}
  source={require('./ic_action_name.png')} />
  onPress={() => this.moveToAddNewCustomer()}>
 </TouchableHighlight>

Cuando traté de ejecutar la aplicación, recibí este error

Se espera que React.Childeren.only reciba un solo elemento React child

¿Cómo arreglar esto?

Tienes que hacerlo así:

<TouchableHighlight onPress={() => this.moveToAddNewCustomer()}>
    <Image style={styles.imagestyle} source={require('./ic_action_name.png')} />
</TouchableHighlight>

o

<TouchableOpacity onPress={()=>this.moveToAddNewCustomer()}>
    <Image style={styles.imagestyle} source={require('./ic_action_name.png')} />
</TouchableOpacity>

De forma predeterminada, no hay clics ni eventos adjuntos con ninguna de las vistas en React Native como React.js. Hay principalmente dos vistas diseñadas específicamente para manejar eventos táctiles. Ellos son TouchableOpacity y TouchableHighlight. Puede resolver su problema envolviendo su Image componente con TouchableOpacity o TouchableHighlight.

<TouchableHighlight onPress={() => this.moveToAddNewCustomer()}>
    <Image style={styles.imagestyle} source={require('./ic_action_name.png')} />
</TouchableHighlight>

https://reactnative.dev/docs/touchablehighlight

https://reactnative.dev/docs/touchableopacity

si

TouchableHighlight onPress={() => this.moveToAddNewCustomer()}>
    <Image style={styles.imagestyle} source={require('./ic_action_name.png')} />
</TouchableHighlight>

no funcionó, deberías poner tu imagen en un <view>

Resolví mi problema usando “TouchableWithoutFeedback”

<TouchableWithoutFeedback
    onPress={() => {
       this.moveToAddNewCustomer()}
    }}
>
    <Image
      style={styles.newImage}
      // resizeMode="contain"
      source={require("~/assets/images/test123.png")}
    />
</TouchableWithoutFeedback>

si

TouchableHighlight onPress={() => this.moveToAddNewCustomer()}>
<Image style={styles.imagestyle} source={require('./ic_action_name.png')} />
</TouchableHighlight>

no funcionó o incluso envolvió la imagen con la vista, entonces le recomiendo que busque en su

style={styles.imagestyle}

tratar de usar zIndex: 10
existe una pequeña posibilidad de que su imagen haya sido superpuesta por algo, pero no pierde la imagen.