React Native + Expo: Setting focus on useEffect not working in an Android Box

Viewed 146

I created a simple home page in React-Native with an image that should be focused automatically, so that when the user clicks on the center button of an Android Box it goes to another page.

This code works on Expo in my computer, but when I test it on Expo Go in the Android Box I get the error:

Uncaught Error: TypeError: l.current.focus is not a function. (In 'l.current.focus()', 'l.current.focus' is undefined)

My code is as follows:

import { StyleSheet, Image, View, TouchableWithoutFeedback } from 'react-native';
import * as React from 'react';

const HomeScreen = ({navigation}) => {

  const goToNextScreen = React.useRef()

  React.useEffect(() => {
    goToNextScreen.current.focus()
  }, []);

  return (
      <View style={styles.container}>
        <TouchableWithoutFeedback
            ref={goToNextScreen}
            onPressOut={() => navigation.navigate('NextPage')}>
            <Image
                source={require('../assets/img/logo.png')}
            />
        </TouchableWithoutFeedback>
      </View>
  );
}

export default HomeScreen;

Can someone point me to the right direction?

0 Answers
Related