Expo Android 应用程序在 navigation.navigate() 上崩溃
Posted
技术标签:
【中文标题】Expo Android 应用程序在 navigation.navigate() 上崩溃【英文标题】：Expo Android Application crashing on navigation.navigate() 【发布时间】：2021-05-27 15:51:37 【问题描述】：我的 React Native 应用程序的 android 版本在独立构建和 Expo 客户端的 navigation.navigate() 上崩溃。这是一个世博会管理项目，仅供参考。
这是我学到的——这些错误只发生在 Android 上，而不会发生在 ios 上。它们仅在从我的应用程序上的一个非常特定的组件（如下所示）导航时发生，在其他任何地方都不会发生。它与被导航到的屏幕无关，因为删除这些屏幕的整个代码并只是导航到一个简单的<View> </View> 仍然会导致崩溃。此外，上面提到的相同屏幕可以从其他屏幕导航到没有任何问题。这些崩溃发生的原因没有明确的原因，但我的理解是它们是本机崩溃。我在开发中没有收到任何错误，也没有针对这些错误的哨兵报告。我唯一设法获得的是来自我的独立构建的堆栈跟踪。
这是堆栈跟踪：
pid: 0, tid: 0 >>> com.nothing.nothingapp <<<
backtrace:
#00 pc 000000000039fe88 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::GLFunctorDrawable::onDraw(SkCanvas*)+984)
#00 pc 00000000004410f0 /system/lib64/libhwui.so (SkDrawable::draw(SkCanvas*, SkMatrix const*)+88)
#00 pc 000000000070d684 /system/lib64/libhwui.so (SkGpuDevice::drawDrawable(SkDrawable*, SkMatrix const*, SkCanvas*)+300)
#00 pc 00000000003590d0 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::drawContent(SkCanvas*) const+1252)
#00 pc 000000000035a1c4 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::forceDraw(SkCanvas*) const+200)
#00 pc 00000000004410f0 /system/lib64/libhwui.so (SkDrawable::draw(SkCanvas*, SkMatrix const*)+88)
#00 pc 0000000000359124 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::drawContent(SkCanvas*) const+1336)
#00 pc 000000000035a1c4 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::forceDraw(SkCanvas*) const+200)
#00 pc 00000000004410f0 /system/lib64/libhwui.so (SkDrawable::draw(SkCanvas*, SkMatrix const*)+88)
#00 pc 0000000000359124 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::drawContent(SkCanvas*) const+1336)
#00 pc 000000000035a1c4 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::forceDraw(SkCanvas*) const+200)
#00 pc 00000000004410f0 /system/lib64/libhwui.so (SkDrawable::draw(SkCanvas*, SkMatrix const*)+88)
#00 pc 0000000000359124 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::drawContent(SkCanvas*) const+1336)
#00 pc 000000000035a1c4 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::forceDraw(SkCanvas*) const+200)
#00 pc 00000000004410f0 /system/lib64/libhwui.so (SkDrawable::draw(SkCanvas*, SkMatrix const*)+88)
#00 pc 0000000000359124 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::drawContent(SkCanvas*) const+1336)
#00 pc 000000000035a1c4 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::forceDraw(SkCanvas*) const+200)
#00 pc 00000000004410f0 /system/lib64/libhwui.so (SkDrawable::draw(SkCanvas*, SkMatrix const*)+88)
#00 pc 0000000000359124 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::drawContent(SkCanvas*) const+1336)
#00 pc 000000000035a1c4 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::forceDraw(SkCanvas*) const+200)
#00 pc 00000000004410f0 /system/lib64/libhwui.so (SkDrawable::draw(SkCanvas*, SkMatrix const*)+88)
#00 pc 0000000000359124 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::drawContent(SkCanvas*) const+1336)
#00 pc 000000000035a1c4 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::forceDraw(SkCanvas*) const+200)
#00 pc 00000000004410f0 /system/lib64/libhwui.so (SkDrawable::draw(SkCanvas*, SkMatrix const*)+88)
#00 pc 00000000003590fc /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::drawContent(SkCanvas*) const+1296)
#00 pc 000000000035a1c4 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::forceDraw(SkCanvas*) const+200)
#00 pc 00000000004410f0 /system/lib64/libhwui.so (SkDrawable::draw(SkCanvas*, SkMatrix const*)+88)
#00 pc 00000000003590fc /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::drawContent(SkCanvas*) const+1296)
#00 pc 000000000035a1c4 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::RenderNodeDrawable::forceDraw(SkCanvas*) const+200)
#00 pc 00000000003a59a8 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::SkiaPipeline::renderLayersImpl(android::uirenderer::LayerUpdateQueue const&, bool)+688)
#00 pc 00000000003a7110 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::SkiaPipeline::renderFrame(android::uirenderer::LayerUpdateQueue const&, SkRect const&, std::__1::vector<android::sp<android::uirenderer::RenderNode>, std::__1::allocator<android::sp<android::uirenderer::RenderNode> > > const&, bool, android::uirenderer::Rect const&, sk_sp<SkSurface>, SkMatrix const&)+124)
#00 pc 00000000003a45b4 /system/lib64/libhwui.so (android::uirenderer::skiapipeline::SkiaOpenGLPipeline::draw(android::uirenderer::renderthread::Frame const&, SkRect const&, SkRect const&, android::uirenderer::LightGeometry const&, android::uirenderer::LayerUpdateQueue*, android::uirenderer::Rect const&, bool, android::uirenderer::LightInfo const&, std::__1::vector<android::sp<android::uirenderer::RenderNode>, std::__1::allocator<android::sp<android::uirenderer::RenderNode> > > const&, android::uirenderer::FrameInfoVisualizer*)+416)
#00 pc 00000000003ad224 /system/lib64/libhwui.so (android::uirenderer::renderthread::CanvasContext::draw()+1080)
#00 pc 00000000003af460 /system/lib64/libhwui.so (_ZNSt3__110__function6__funcIZN7android10uirenderer12renderthread13DrawFrameTask11postAndWaitEvE3$_0NS_9allocatorIS6_EEFvvEEclEv$c303f2d2360db58ed70a2d0ac7ed911b+524)
#00 pc 000000000039d928 /system/lib64/libhwui.so (android::uirenderer::WorkQueue::process()+208)
#00 pc 00000000003bfb44 /system/lib64/libhwui.so (android::uirenderer::renderthread::RenderThread::threadLoop()+88)
#00 pc 000000000001553c /system/lib64/libutils.so (android::Thread::_threadLoop(void*)+320)
#00 pc 0000000000014db0 /system/lib64/libutils.so (thread_data_t::trampoline(thread_data_t const*)+408)
#00 pc 00000000000b61f4 /apex/com.android.runtime/lib64/bionic/libc.so (__pthread_start(void*)+64)
#00 pc 0000000000050e24 /apex/com.android.runtime/lib64/bionic/libc.so (__start_thread+64)
这是我从中导航的组件：
import React, useState, useEffect, useContext from 'react';
import StyleSheet, Text, View, Image, TouchableOpacity, FlatList, TextInput, Alert from 'react-native';
import Button, Overlay from 'react-native-elements';
import WebView from 'react-native-webview';
import AntDesign, MaterialIcons from '@expo/vector-icons';
import useNavigation from '@react-navigation/native';
import useIsFocused from "@react-navigation/native";
import * as Linking from 'expo-linking';
import * as Updates from 'expo-updates';
import Clipboard from 'expo-clipboard';
import pure from 'recompose/pure'
import moment from 'moment';
import HeartButton from './Features/HeartButton';
import StarBar from './Features/StarBar';
import Comment from './NewsfeedComment';
import Reply from './NewsfeedReply';
import LoginModal from '../Login/LoginModal'
import Modal from 'react-native-modal';
import NewsfeedContext from '../../App';
import HeartsContext from '../../App';
import CommentsContext from '../../App';
import NotificationsContext from '../../App';
import ProfileDataContext from '../../App';
import ProfileContext from '../../App';
import UserProfileContext from '../../App';
import UserProfileDataContext from '../../App';
import MovieLikesContext from '../../App';
const Posts = (props) =>
// Initializes Navigator
const navigation = useNavigation();
if (props.data.active == true)
return (
<>
props.data.feedTypeDesc == "recommendation" && props.data.recommendation.active == true ?
<View>
/* Code for the component, everything is working fine */
</View>
: null
/* List Modal */
<View>
<Modal
isVisible=showList
onBackdropPress=() => setShowList(false)
onModalHide=() => if (newSwitch == true) toggleCreateListModal() >
<View style= flex: 0.5, backgroundColor: '#fff' >
<Text style= textAlign: 'center', marginTop: 10, fontSize: 18 >Add to my list</Text>
<FlatList
style=styles.innerScroll
data=[...props.listData, addGroup: true ]
style= marginLeft: 40, marginTop: 10
renderItem=( item ) =>
if (item.addGroup)
return (
<View style= marginRight: 8, marginVertical: 4 >
<TouchableOpacity onPress=() => switchModal()>
<View style=styles.newbox>
<Text style=styles.newname>New List</Text>
</View>
</TouchableOpacity>
</View>);
return (
<View style= marginRight: 8, marginVertical: 4 >
<TouchableOpacity onPress=() => addList(item)>
<View style=styles.box>
<Text style=styles.name>item.name ? item.name : 'Name'</Text>
</View>
</TouchableOpacity>
</View>
)
keyExtractor=(item) => `item-$item.id`
numColumns=3
/>
</View>
</Modal>
</View>
/* Create List Modal */
<View>
<Modal
isVisible=showCreate
onBackdropPress=() => setShowCreate(false)>
<View style= flex: 0.32, backgroundColor: '#fff', borderRadius: 10 >
<Text style= textAlign: 'center', marginTop: 20 >Create a new list</Text>
<View style= marginTop: 40, marginLeft: 30, width: '80%', backgroundColor: '#f0f0f0', borderRadius: 4 >
<TextInput
placeholder="Da..."
placeholderTextColor="#6b6b6bfd"
autoCapitalize='none'
value=name
onChangeText=(newValue) => setName(newValue)
style= padding: 3, fontSize: 16, color: '#000' />
</View>
<View style= flexDirection: 'row', justifyContent: 'space-around', marginTop: 40 >
<TouchableOpacity>
<Text>
Cancel
</Text>
</TouchableOpacity>
<TouchableOpacity onPress=createList>
<Text>
Create
</Text>
</TouchableOpacity>
</View>
</View>
</Modal>
</View>
/* Edit Post Modal */
<View>
<Modal
isVisible=showMain
onBackdropPress=() => setShowMain(false)>
<View style= flex: 0.32, backgroundColor: '#fff', borderRadius: 10 >
<Text style= textAlign: 'center' >Options</Text>
<TouchableOpacity onPress=() => Linking.openURL('http://www.facebook.com/sharer/sharer.php?u=https://panodime.com/watch/sharing/' + props.data.id)>
<Text style= textAlign: 'left' >Share post to Facebook</Text>
</TouchableOpacity>
<TouchableOpacity onPress=() => Linking.openURL('http://www.twitter.com/intent/tweet?text=https://panodime.com/watch/sharing/' + props.data.id)>
<Text style= textAlign: 'left' >Share post to Twitter</Text>
</TouchableOpacity>
<TouchableOpacity onPress=() => Clipboard.setString("https://panodime.com/watch/sharing/" + props.data.id); Alert.alert("Success!", "Link has been copied") >
<Text>Share this post elsewhere: <Text selectable=true>https://panodime.com/watch/sharing/props.data.id</Text></Text>
</TouchableOpacity>
loggedIn ?
<>
props.profileData.login == props.data.user ?
<>
<TouchableOpacity onPress=() => navigation.navigate("EditRecommendation", props: props )>
<Text style= textAlign: 'left' >Edit Post</Text>
</TouchableOpacity>
<TouchableOpacity onPress=() => deleteReccomendation()>
<Text style= textAlign: 'left' >Delete Post</Text>
</TouchableOpacity>
</>
: null
</>
: null
</View>
</Modal>
</View>
/* Login Gate */
<View>
<Modal
isVisible=showLogin
onBackdropPress=() => setShowLogin(false)>
<View style= flex: 0.95, backgroundColor: '#fff' >
<Button
buttonStyle= width: 40, height: 40, padding: 0, backgroundColor: '#fff', borderRadius: 10
icon= name: 'close', color: '#000', size: 20
onPress=() => setShowLogin(false)
/>
<LoginModal />
</View>
</Modal>
</View>
</>
);
else
return null
export default pure(Posts);
这是被导航到的屏幕：
function Movie( route, navigation )
const authContext = React.useContext(AuthContext);
const props = route.params;
return (
<View style= flex: 1, backgroundColor: '#fff' >
<MovieScreen props=props token=authContext.authState.token status=authContext.authState.status />
</View>
);
这是我的 package.json：
"main": "node_modules/expo/AppEntry.js",
"scripts":
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
,
"dependencies":
"@material-ui/core": "^4.11.0",
"@react-native-async-storage/async-storage": "^1.13.2",
"@react-native-community/clipboard": "^1.5.1",
"@react-native-community/masked-view": "0.1.10",
"@react-navigation/bottom-tabs": "^5.9.2",
"@react-navigation/compat": "^5.3.0",
"@react-navigation/native": "^5.8.0",
"@react-navigation/stack": "^5.10.0",
"@reduxjs/toolkit": "^1.5.0",
"@sentry/browser": "^6.0.2",
"@sentry/react-native": "^2.1.1",
"@sentry/tracing": "^6.0.2",
"expo": "^40.0.1",
"expo-activity-feed": "^0.9.1",
"expo-app-loading": "^1.0.1",
"expo-av": "~8.7.0",
"expo-clipboard": "~1.0.1",
"expo-constants": "~9.3.3",
"expo-facebook": "~9.1.0",
"expo-google-app-auth": "^8.1.3",
"expo-google-sign-in": "~8.4.0",
"expo-image-picker": "~9.2.0",
"expo-linear-gradient": "~8.4.0",
"expo-notifications": "~0.8.2",
"expo-splash-screen": "~0.8.1",
"expo-status-bar": "~1.0.3",
"expo-updates": "~0.4.1",
"install": "^0.13.0",
"moment": "^2.29.1",
"native-base": "^2.13.14",
"npm": "^6.14.11",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
"react-native-anchor-carousel": "^3.1.2",
"react-native-animatable": "^1.3.3",
"react-native-elements": "^3.0.0-alpha.1",
"react-native-gesture-handler": "~1.8.0",
"react-native-modal": "^11.5.6",
"react-native-reanimated": "~1.13.0",
"react-native-restart": "0.0.17",
"react-native-safe-area-context": "3.1.9",
"react-native-screens": "~2.15.2",
"react-native-skeleton-content": "^1.0.20",
"react-native-star-rating": "^1.1.0",
"react-native-swipe-modal-up-down": "^1.0.9",
"react-native-swiper": "^1.6.0",
"react-native-swiper-flatlist": "^2.0.4",
"react-native-vector-icons": "^7.1.0",
"react-native-video": "^5.1.1",
"react-native-vimeo": "^0.3.0",
"react-native-web": "~0.13.12",
"react-native-webview": "11.0.0",
"react-native-webview-bridge": "^0.40.1",
"react-navigation": "^1.6.1",
"react-redux": "^7.2.2",
"recompose": "^0.30.0",
"redux": "^4.0.5",
"sentry-expo": "^3.0.4"
,
"devDependencies":
"@babel/core": "~7.9.0",
"redux-devtools": "^3.7.0"
,
"private": true
【问题讨论】：
【参考方案1】：你必须像这样传递道具
function Movie( route, navigation )
const authContext = React.useContext(AuthContext);
const props = route.params;
return (
<View style= flex: 1, backgroundColor: '#fff' >
// removed props=props and added ...props
<MovieScreen ...props token=authContext.authState.token status=authContext.authState.status />
</View>
);
【讨论】：
试过这个，但没用。它仍然崩溃。 如果你可以用代码在snack.expo.io 上创建一个零食，我可以解决这个问题。 我在 Android 上遇到了同样的问题。它在 iOS 上也能正常工作。 奇怪，能不能在expo上分享点心我可以看看。【参考方案2】：这是你的 webview，添加这个样式：
<WebView style= opacity: 0.99, minHeight: 1 ... />
【讨论】：
以上是关于Expo Android 应用程序在 navigation.navigate() 上崩溃的主要内容，如果未能解决你的问题，请参考以下文章
EXPO 应用程序在 iOS 出现在前面时会闪烁，但 Android 没有问题。它是由 EXPO 自动创建的（反应导航）
在 Expo/React Native 中包含 Android 权限
Expo Android 应用程序在 navigation.navigate() 上崩溃
如何在 Android 上减小 expo/react-native 应用程序的大小