I've encountered an issue while attempting to navigate to my (tabs)/index.tsx screen from a different screen outside of the (tabs) folder on the web version of my app. Surprisingly, it functions perfectly on mobile devices. Initially, I attempted importing HomeScreen from (tabs)/index.tsx and then navigating to it, but unfortunately, that approach didn't yield any positive results. Subsequently, I tried directly accessing (tabs)/index.tsx, only to face yet another setback.
Below is the code snippet for my first attempt:
import HomeScreen from './(tabs)/index';
//other code
const handleContinue = () => {
if (Platform.OS === "web") {
window.location.href = `${HomeScreen}?selectedTopics=${encodeURIComponent(JSON.stringify(selectedTopics))}`;
} else {
navigation.navigate('tabs', { screen: 'Home', params: { selectedTopics } });
}
};Subsequently, here's the code snippet for the second attempt:
const handleContinue = () => {
if (Platform.OS === "web") {
window.location.href = `/(tabs)/index?selectedTopics=${encodeURIComponent(JSON.stringify(selectedTopics))}`;
} else {
navigation.navigate('tabs', { screen: 'Home', params: { selectedTopics } });
}
};Unfortunately, both approaches resulted in the error message "This screen doesn't exist". How can I resolve this perplexing problem?