我们遇到了一个问题,即我们的 React Native Android 应用程序由于内存泄漏而在某些设备上崩溃。虽然它在大多数设备上都能完美运行,但大约 25% 的用户报告了此崩溃。该问题已通过 Crashlytics 进行跟踪,并使用 LeakCanary 进行进一步调查,发现在屏幕(底部选项卡或堆栈导航)之间导航时会发生内存泄漏。
\n演示问题的存储库 Github 链接
\n下面是导航结构:
\n// main navigation\n<NavigationContainer>\n <Stack.Navigator>\n <Stack.Screen name="Auth" component={Auth} />\n <Stack.Screen name="App" component={Drawer} />\n </Stack.Navigator>\n</NavigationContainer>\n\n// drawer\n<Drawer.Navigator drawerContent={(props) => <DrawerContent {...props} />}>\n <Drawer.Screen name="Main" component={BottomTabs} />\n</Drawer.Navigator>\n\n\n// Bottom Tabs\n<BottomTab.Navigator>\n <BottomTab.Screen name="Tab1" component={Stack1} />\n <BottomTab.Screen name="Tab2" component={Stack2} />\n <BottomTab.Screen name="Tab3" component={Stack3} />\n <BottomTab.Screen name="Tab4" component={Stack4} />\n</BottomTab.Navigator>\n\n// Stack 1 \n<Stack.Navigator>\n <Stack.Screen name="Main" component={Screen} />\n <Stack.Screen name="Screen2" component={Screen2} />\n <Stack.Screen name="Screen3" component={Screen3} />\n <Stack.Screen name="Screen4" component={Screen4} />\n <Stack.Screen name="Screen5" …Run Code Online (Sandbox Code Playgroud) android react-native react-navigation react-native-reanimated react-native-screens
My app is working as expected in the debug mode
react-native run-android
Run Code Online (Sandbox Code Playgroud)
but in the release build
react-native run-android --variant=release
Run Code Online (Sandbox Code Playgroud)
The app launches fine and I can navigate to all the pages, but whenever I try to scroll or press any view inside a ScrollView, it crashes. For example, in the code below, the HomeHeader component has two buttons that work well, but whenever I touch anything inside the ScrollView, Unfortunately it crashes. My code is as follow:
<SafeAreaView style={{flex:1}}> …Run Code Online (Sandbox Code Playgroud) 我正在研究react-navigation v6,想知道以下两种结构在性能方面是否有所不同,特别是因为我正在深度链接到详细信息屏幕。
第一个结构:
const Tab = createBottomTabNavigator();
const Stack = createNativeStackNavigator();
function HomeTabs() {
return (
<Tab.Navigator>
<Tab.Screen name="Feed" component={FeedScreen} />
<Tab.Screen name="Profile" component={ProfileScreen} />
<Tab.Screen name="Account" component={AccountScreen} />
<Tab.Screen name="Orders" component={OrderScreen} />
</Tab.Navigator>
);
}
export default function App() {
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen name="Home" component={HomeTabs} />
<Stack.Screen name="FeedDetails" component={FeedDetails} />
<Stack.Screen name="ProfileDetails" component={ProfileDetails} />
<Stack.Screen name="AccountDetails" component={AccountDetails} />
<Stack.Screen name="OrderDetails" component={OrderDetails} />
</Stack.Navigator>
</NavigationContainer>
);
}
Run Code Online (Sandbox Code Playgroud)
第二个结构:
const FeedStack = createNativeStackNavigator();
const ProfileStack = createNativeStackNavigator();
const AccountStack …Run Code Online (Sandbox Code Playgroud) 我有三个导航器,登录完成后我导航到DashBoard屏幕,但是当我想从DashBoard屏幕注销时出现问题,this.props.navigation.navigate('Login')工作正常但是我想在按下注销按钮时清除堆栈.
const DashBoardStackNavigator = createStackNavigator({
DashBoard: DashBoard,
Second:Second,
Third:Third
})
const BottomTabNavigator = createBottomTabNavigator({
DashBoardStackNavigator,
Account,
Report,
Members
}})
const AppStackNavigator = createStackNavigator({
Login: Login,
BottomTabNavigator: BottomTabNavigator
})
export default createAppContainer(AppStackNavigator)
Run Code Online (Sandbox Code Playgroud)
我试了以下没有运气
const resetAction = StackActions.reset({
index: 0,
actions: [NavigationActions.navigate({ routeName: 'Login' })],
});
this.props.navigation.dispatch(resetAction);
Run Code Online (Sandbox Code Playgroud)
错误:没有为密钥登录定义路由,必须是DashBoard之一
我有一个 razor 页面,它依赖于它的父类和一个有自己的类并从其父类接收数据的第二个孩子,我的问题是对 api 的第二次调用,数据没有传递给第二个孩子,当其父项更改其数据时,第二个子项不会被渲染,但它可以在第一个渲染器上工作并且正在传递数据。
Parent.razor
@inherits ParentBase;
<FirstChild/>
<SecondChild data="@data"/>
Run Code Online (Sandbox Code Playgroud)
FirstChild.razor
@inherits ParentBase;
// call its parent method
<span @onclick='(() => callApi())'/>
Run Code Online (Sandbox Code Playgroud)
父数据库
public class ParentBase : ComponentBase
{
public Data data { get; set; }
protected override async Task OnInitializedAsync()
{
data = await Services.GetData();
}
// call from a child
public void callApi
{
data = await Services.GetData();
}
}
Run Code Online (Sandbox Code Playgroud)
SecondChild.razor
<Table data="@data"/>
Run Code Online (Sandbox Code Playgroud)
SecondChildBase.cs
public class SecondChildBase : ComponentBase
{
[Parameter]
public Data data { get; set; …Run Code Online (Sandbox Code Playgroud) 如何在子组件中的 onClick 事件上将多个参数从子组件传递给父组件
儿童剃须刀
@foreach( var item in items)
{
@foreach( var score in item.scores)
{
<span @onclick="ItemClicked(item.name, score.id)">
@item.name
</span>
}
}
Run Code Online (Sandbox Code Playgroud)
父母剃刀
<Child ItemClicked = "@ItemClicked"/>
@code{
private void ItemClicked(string name, int id)
{
Console.WriteLine(name);
Console.WriteLine(id);
}
}
Run Code Online (Sandbox Code Playgroud) react-native ×4
android ×2
asp.net ×2
blazor ×2
c# ×2
razor ×2
.net ×1
apk ×1
javascript ×1
navigation ×1
reactjs ×1
release ×1
scrollview ×1