React Native Navigation Is Not Working On Touchableopacity

I tried react-native on Button which is working fine. I want to customize Button so this made me to go for TouchableOpacity. I am trying to setup react native navigation like below

Solution 1:

It was a tpyo error at this line this.navigate("EnableNotifcation");

I corrected it and it is working now. this.navigate("EnableNotification");

Solution 2:

The onPress prop should be inside TouchableOpacity, not inside of the View props like you have it. See the pseudo code below

<TouchableOpacityonPress = {...}><Viewstyle = {{}}>
    //Rest of the code

This should fix it. On a sidenote, i would recommend adding a new style for your view component, theres a lot of elements in there :P

Edit:

<TouchableOpacityonPress = {/*dothis*/}><Viewstyle={{backgroundColor: "#FE434C",
                               alignItems: "center",
                               justifyContent: "center",
                               borderRadius:10,
                               width:240, marginTop:30,
                               height:40 }}><Textstyle={{color: "white" }}>
                        {"CONTINUE"}
                    </Text></View></TouchableOpacity>

Solution 3:

Using following worked for me. using react native 0.62.2. See TouchableOpacity is inside KeyboardAvoidingView and ScrollView keyboardShouldPersistTaps.

<ScrollViewkeyboardShouldPersistTaps="handled"><KeyboardAvoidingViewenabled><View><TouchableOpacityonPress={() => functionNameToNavigate('ScreenToMoveOn')}> <Text>Click me</text></TouchableOpacity></View></KeyboardAvoidingView></ScrollView>