等待回调的数量过多:501 React Navigation

Question

我使用StackNavigator为我的聊天应用程序，当我使用动态标题，它抛出过多的待处理回调错误:501。{'1434: {'module': ReanimatedModule;'， 'method': 'getValue'};经过一些调试，我发现headerTitle抛出错误。我的代码如下为App.js:

function ChatStack() {
return (
<Stack.Navigator>
<Stack.Screen name="ChatStack" component={ChatScreen}
options={({navigation, route}) => (
{ headerTitle: () => {
return (
<View>
<Text style={{fontSize: 18}}>{route.params.username}</Text> 
{!!route.params.onlineStatus && (
<Text style={{fontSize: 15}}> {route.params.onlineStatus} 
</Text>)}
</View>
);
},
headerLeft: () => (
<TouchableOpacity style={{alignItems: 'center', flexDirection: 'row'}} 
onPress={() => { navigation.goBack(); }}>
<Icon name="ios-arrow-back" size={18} color="#242424" />
</TouchableOpacity>
),
})
} />
</Stack.Navigator>
);
}

设置参数的代码:

useEffect(() => {
const unsubscribe = database() .ref(users/${userId})
.on('value', (snapshot) => {
if (snapshot && snapshot.exists()) {
const val = snapshot.val();
if (typeof val.online === 'string') {
props.navigation.setParams({ onlineStatus: val.online, });
} else {
const lastSeen = new Date(val.online);
props.navigation.setParams({ onlineStatus: moment(lastSeen).calendar(),
});
}
}
});
return () => unsubscribe(); }, [props.navigation, props.route, userId]);

经过大量的调试和研究，我得出的结论是，设置onlineStatus参数的实时数据库侦听器导致了过多回调的错误。有人对此有解决方案或解决方法来修复此错误吗?

Answer 1

很可能TouchableOpacity是您的问题的原因。

当前有一个TouchableOpacity导致excessive number of pending callbacks: 501.的问题

• 作为变通方法，更改您的导入
  • from:import { TouchableOpacity } from "react-native";
  • to:import { TouchableOpacity } from "react-native-gesture-handler";

详细信息请参见:

• 解决方法说明
• 等待修复

Answer 2

将导入表单原生库更改为markup-kit

npm install react-native-markup-kit
import {TouchableOpacity} from 'react-native-markup-kit';