javascript - “应该有一个队列。这很可能是 React 中的一个错误。请提交一个问题。” React-Native 错误
问题描述
我目前正在开发的 React-Native 应用程序的标题中出现错误。
我经历了数小时的故障排除,似乎没有在线解决方案。
从我收集到的信息来看,以下钩子const [isOpen, setIsOpen] = useState(false);
在这里引起了问题,可能是由于钩子的顺序。这个钩子用于切换我自定义构建的菜单。但是,当我尝试导航到另一个屏幕<TouchableOpacity onPress={() => navigation.navigate('Job')}>
(从屏幕堆栈,而不是从模式或卡片)时,应用程序中断并且我收到错误消息。如果我注释掉 hook 的一行钩子const [isOpen, setIsOpen] = useState(false);
,导航工作得很好。
一个解决方案将不胜感激。
配置.js
export const sharedScreenOptions = (props) => {
const [isOpen, setIsOpen] = useState(false);
const toggleMenu = () => {
setIsOpen(!isOpen);
LayoutAnimation.easeInEaseOut();
};
return {
headerBackTitleVisible: false,
header: (props) => {
return (
<>
<GradientHeader isOpen={isOpen} {...props} />
{isOpen ? (
<TouchableOpacity
style={{
height: Dimensions.get('window').height,
width: Dimensions.get('window').width,
backgroundColor: 'rgba(42, 44, 65, 0.5)',
position: 'absolute',
zIndex: -999,
}}
onPress={() => toggleMenu()}></TouchableOpacity>
) : null}
</>
);
},
headerRight: () => {
return (
<View style={styles.iconContainer}>
<TouchableOpacity onPress={() => navigation.navigate('Job')}>
<MailButton navigation={props.navigation} />
</TouchableOpacity>
<NotificationButton navigation={props.navigation} />
<TouchableOpacity onPress={() => toggleMenu()}>
{isOpen ? <CloseButton /> : <HamburgerButton />}
</TouchableOpacity>
</View>
);
},
headerStyle: {
backgroundColor: 'transparent',
},
};
};
导航.js
const JobboardStack = createStackNavigator();
const JobboardStackScreens = () => {
return (
<JobboardStack.Navigator
initialRouteName="Jobboard"
screenOptions={sharedScreenOptions}>
<JobboardStack.Screen
name="JobBoard"
component={JobboardScreen}
options={{
headerTintColor: '#FFFFFF',
headerTitleStyle: {
fontFamily: 'Raleway-Regular',
fontWeight: '500',
opacity: 0,
},
}}
/>
<JobboardStack.Screen
name="Job"
component={JobScreen}
options={{
headerTintColor: '#FBF7EF',
}}
/>
</JobboardStack.Navigator>
);
};
解决方案
推荐阅读
- c++ - 解释 for (char c : str) 是做什么的?
- java - 如何将 EBNF 重复实现为 Java 代码?
- php - 产品 (........ ) 结束了。PrestaShop 1.7
- swift - 为什么 SomeStruct() is AnyObject 返回 true?
- html - 引导选项卡无法访问 Vuejs
- spring - DirectMessageListenerContainer 和 SimpleMessageListenerContainer 与 Rabbit Channels 的关系
- powershell - 如何增加 Read-Host 读取的最大字符数?
- node.js - 在使用套接字制作游戏时,处理独立于所有玩家的多个对象的最有效方法是什么?
- python - Django 在每台服务器中保留不同的数据库设置
- typescript - 打字稿在解决承诺时忽略类型