useLinking с обратным вызовом ref

Question

Я пытаюсь реализовать глубокое связывание для моего приложения с использованием response-navigation v5.

Я хотел бы установить в качестве ссылки моей навигацииConConerer хук useLinking из response-native, и в то же время установить ссылка на мой навигатор верхнего уровня:

const AppNavigationContainer: FC = () => {
    let navigatorRef;
    const [isReady, setIsReady] = useState<boolean>(false);
    const [initialState, setInitialState] = useState();
    const {getInitialState} = useLinking(navigatorRef, {
        prefixes: [prefix]
    });

    useEffect(() => {
        Promise.race([
            getInitialState(),
            new Promise(resolve => setTimeout(resolve, 150))
        ])
            .catch(console.log)
            .then(state => {
                if (state !== undefined) {
                    setInitialState(state);
                }
                setIsReady(true);
            });
    }, [getInitialState]);

    if (!isReady) {
        return null;
    }
    return (
        <NavigationContainer
            ref={(ref) => {
                NavigationService.setTopLevelNavigator(ref);
                navigatorRef = ref;
            }}
            initialState={initialState}
        >
            <StartupNavigator initialRouteName={Routes.CHECK}/>
        </NavigationContainer>
    );
}

Но здесь я получил undefined is not an object (evaluating 'ref.current') от хуков useLinking.

Как установить мой реф на useLinking и в то же время, установить мой навигатор верхнего уровня?

Answer 1

Вы можете установить свойство current для ссылки:

const navigatorRef = React.useRef();

// ...

return (
    <NavigationContainer
        ref={(ref) => {
            NavigationService.setTopLevelNavigator(ref);
            navigatorRef.current = ref;
        }}
        initialState={initialState}
    >
        <StartupNavigator initialRouteName={Routes.CHECK}/>
    </NavigationContainer>
);