Touchable child must either be native or forward setNativeProps to a native component at invariant

[L-Jovi]

hi, my react-native version 0.37.0, and I use below object which provide to Stylesheet

styles

banner: {
  position: 'absolute',
  left: 0,
  right: 0,
  portrait: {
    top: 64 + 7,
  },
  landscape: {
    top: 0,
  },
}

js code

import React, { Component, } from 'react';
import {
  StyleSheet,
  View,
  Text,
  Image,
  TouchableOpacity,
  TouchableHighlight,
  TouchableWithoutFeedback,
} from 'react-native-responsive-styles';

class Banner extends Component {
  static styles = StyleSheet.create(styles);

  render() {
    const { styles, } = Banner;

    return () {
      <View style={styles.banner}>
        <TouchableWithoutFeedback
          onPress={actsMixed.platform.toggleDropDown}>
          <Animated.View style={[ styles.backDrop, { opacity: this.state.backdropOpacity, }, ]} />
        </TouchableWithoutFeedback>

        {/* some other components */}
      </View>
    }
    
  }
}

but I encounter the error as title say, how could I fix it?

thanks for your time.

regards.

[jevakallio]

It looks like we will need to provide a wrapper class for TouchableWithoutFeedback and TouchableHighlight which implements setNativeProps and forwards that to the child Touchable. See example here: https://facebook.github.io/react-native/docs/direct-manipulation.html#forward-setnativeprops-to-a-child

I'll gladly accept a PR with this change. Otherwise I can look at fixing this earliest next week.