我是React-Native开发的新手。以前,我在不同的混合移动的应用程序框架(离子, cordova 等)开发了许多应用程序。调试离子, cordova 框架的应用程序非常容易。请建议调试React-Native应用程序的最佳方法
s71maibg1#
如果您使用的是Android Emulator,请按计算机键盘上的CTRL + M打开调试菜单。如果您使用的是iOS模拟器,请从计算机键盘按CMD + D打开调试菜单。点击使用Chrome进行调试以打开计算机中的Chrome调试器工具。在Chrome中打开调试工具后。
现在你可以在屏幕右侧看到调试器控制台窗口。选择控制台选项卡。现在,在您的应用程序中,您可以放置日志来调试应用程序。
示例:
import React, { useState, useEffect } from 'react'; import { View, StyleSheet, Text, LogBox } from 'react-native'; export default function App() { //LogBox.ignoreLogs(['Remote debugger']); useEffect(() => { fetch('https://jsonplaceholder.typicode.com/posts', { method: 'GET', }) .then((response) => response.json()) .then((responseJson) => { console.log(responseJson); }) .catch((error) => { console.error(error); }); }, []); console.log('App Called...'); return ( <View style={styleSheet.MainContainer}> <Text style={styleSheet.text}> Debug App in Android Emulator in React Native using Chrome Debugger Tool. </Text> </View> ); } const styleSheet = StyleSheet.create({ MainContainer: { flex: 1, justifyContent: 'center', alignItems: 'center' }, text: { textAlign: 'center', fontSize: 27, padding: 10 } });
5lwkijsr2#
如果你在react-native项目中使用expo,你应该使用expo-cli,否则react-native-cli应该带有一个模拟器或者一个连接在调试模式下的电话。
nwo49xxi3#
根据我过去的经验,调试React原生应用程序的最佳且简单的方法是使用Flipper应用程序(由Facebook为React原生应用程序开发)
3条答案
按热度按时间s71maibg1#
如果您使用的是Android Emulator,请按计算机键盘上的CTRL + M打开调试菜单。
如果您使用的是iOS模拟器,请从计算机键盘按CMD + D打开调试菜单。
点击使用Chrome进行调试以打开计算机中的Chrome调试器工具。在Chrome中打开调试工具后。
现在你可以在屏幕右侧看到调试器控制台窗口。选择控制台选项卡。
现在,在您的应用程序中,您可以放置日志来调试应用程序。
示例:
5lwkijsr2#
如果你在react-native项目中使用expo,你应该使用expo-cli,否则react-native-cli应该带有一个模拟器或者一个连接在调试模式下的电话。
nwo49xxi3#
根据我过去的经验,调试React原生应用程序的最佳且简单的方法是使用Flipper应用程序(由Facebook为React原生应用程序开发)