Как сделать запись в React Native?

Как я могу зарегистрировать переменную в React Native, например, используя console.log при разработке для Интернета?

ОТВЕТЫ

Ответ 1

console.log работает.

По умолчанию в iOS он регистрируется на панели отладки внутри Xcode.

Из симулятора IOS нажмите (⌘ + D) и нажмите Удаленная отладка JS. Это откроет ресурс http://localhost:8081/debugger-ui на localhost. Оттуда используйте консоль javascript для инструментов Chrome Developer, чтобы просмотреть console.log

Ответ 2

Используйте console.log, console.warn и т.д.

С React Native 0.29 вы можете просто запустить следующее, чтобы просмотреть журналы в консоли:

$ react-native log-ios
$ react-native log-android

Ответ 3

Pre React Native 0.29, запустите это в консоли:

adb logcat *:S ReactNative:V ReactNativeJS:V

Post React Native 0.29, run:

react-native log-ios

или

react-native log-android

Как сказал Мартин в другом ответе.

Это показывает все console.log(), ошибки, заметки и т.д. и вызывает нулевое замедление.

Ответ 4

Используйте console.debug("text");

Вы увидите логи внутри терминала.

шаги:

  • Запустите приложение:
react-native run-ios        # For iOS
react-native run-android    # For Android
  • Запустите регистратор:
react-native log-ios        # For iOS
react-native log-android    # For Android

Ответ 5

Android

В Android это довольно просто, просто введите следующее в своем терминале, как показано в React Native docs:

adb logcat | grep ReactNativeJS

IOS

Вам не нужно запускать Xcode, и вам не нужно использовать отладчик Chrome.

Если вы используете Nuclide IDE, это то, что все инженеры Facebook работают с использованием React:

Нажмите CMD + Shift + P и введите "logs":

введите описание изображения здесь

Вы увидите вывод на вкладке Консоль:

введите описание изображения здесь

Ответ 6

Visual Studio Code имеет приличную консоль отладки, которая может отображать ваш console.log.

введите описание изображения здесь

VS Code чаще всего встречается с React Native.

Ответ 7

Вот где Chrome Developer Tools - ваш друг.

Следующие шаги приведут вас к Chrome Developer Tools, где вы сможете увидеть ваши операторы console.log.

меры

  1. Установите Google Chrome, если вы еще этого не сделали
  2. Запустите приложение, используя react-native run-android react-native run-ios
  3. Открыть меню разработчика
    • Mac: ⌘+D для iOS или ⌘M для Android iOS
    • Windows/Linux: встряхнуть телефон Android
  4. Выберите Debug JS Remotely
  5. Это должно запустить отладчик в Chrome
  6. В Chrome: Tools → More Tools → Developer Options и убедитесь, что вы находитесь на вкладке console

Теперь всякий раз, когда выполняется оператор console.log, он должен появляться в Chrome Dev Tools. Официальная документация здесь.

Ответ 8

Есть 3 метода, которые я использую для отладки при разработке приложений React Native:

  1. console.log(): показывает в консоли
  2. console.warn(): отображается в желтом поле внизу приложения
  3. alert(): отображается как подсказка, как в Интернете

Ответ 9

Я предпочитаю рекомендовать вас, ребята, используя React Native Debugger. Вы можете скачать и установить его с помощью этой команды.

brew update && brew cask install react-native-debugger

или же

Просто проверьте ссылку ниже.

https://github.com/jhen0409/react-native-debugger

Счастливого взлома!

Ответ 10

У меня была такая же проблема: сообщения консоли не появлялись в области отладки XCode. В моем приложении я сделал cmd-d, чтобы открыть меню отладки, и вспомнил, что я установил "Debug in Safari".

Я отключил это, и некоторые сообщения были напечатаны в выходном сообщении, но не в моих консольных сообщениях. Однако одно из сообщений журнала:

__DEV__ === false, development-level warning are OFF, performance optimizations are ON"

Это было связано с тем, что ранее я подключил свой проект для тестирования на реальном устройстве с помощью команды:

react-native bundle --minify

В комплект поставки входит "dev-mode". Чтобы разрешить dev-сообщения, включите флаг -dev:

react-native bundle --dev

И сообщения console.log вернутся! Если вы не привязываетесь к реальному устройству, не забудьте повторно указать jsCodeLocation в AppDelegate.m на localhost (я сделал!).

Ответ 11

Нажмите кнопку [command + control + Z] в Xcode Simulator, выберите Debug JS удаленно, затем нажмите [команда + опция + J], чтобы открыть инструменты разработчика Chrome.

Xcode Simulator Img

обратитесь: Отладка React Native Apps

Ответ 12

Это так просто, чтобы получить логи в React-Native

Используйте console.log и console.warn

console.log('character', parameter)

console.warn('character', parameter)

Этот журнал вы можете просмотреть в консоли браузера. Если вы хотите проверить журнал устройства или, скажем, журнал APK производства, вы можете использовать

adb logcat

adb -d logcat

Ответ 13

react-native-xlog модуль, который может вам помочь, это WeChat Xlog для реагирования. Это может выводиться в консоли Xcode и файле журнала, файлы журнала продуктов могут помочь вам отладить.

Xlog.verbose('tag', 'log');
Xlog.debug('tag', 'log');
Xlog.info('tag', 'log');
Xlog.warn('tag', 'log');
Xlog.error('tag', 'log');
Xlog.fatal('tag', 'log');

Ответ 14

Что-то, что только что появилось около месяца назад, - "Создать React Native App", потрясающий шаблон, который позволяет вам (с минимальными усилиями) показать, как ваше приложение выглядит как живое на вашем мобильном устройстве (ЛЮБОЙ с камерой), используя приложение Expo. Он не только имеет живые обновления, но он позволит вам видеть консольные журналы в вашем терминале так же, как при разработке для веб-сайта, вместо того, чтобы использовать браузер, как мы это делали раньше с React Native.

Вы, конечно, должны были бы создать новый проект с этим шаблоном... но если вам нужно перенести свои файлы, это не должно быть проблемой. Сделайте снимок.

Изменить: на самом деле даже не требуется камера. Я сказал, что для сканирования QR-кода, но вы также можете ввести что-то, чтобы синхронизировать его с вашим сервером, а не только QR-код.

Ответ 15

Журнал регистрации разработки

Для ведения журнала времени разработки вы можете использовать console.log(). Одна важная вещь, если вы хотите отключить ведение журнала в режиме производства, а затем в корневом файле приложения Root, просто назначьте пустую функцию следующим образом: console.log = {} Он полностью отключит всю публикацию журналов по всему приложению, что фактически требуется в режиме производства, так как console.log потребляет время.

Журнал выполнения

В режиме производства также требуется просмотр журналов, когда реальные пользователи используют ваше приложение в режиме реального времени. Это помогает понять ошибки, использование и нежелательные случаи. Для этого есть много сторонних платных инструментов, доступных на рынке. Один из них, который я использовал, - Logentries

Хорошо, что у Logentries есть React Native Module. Таким образом, вам потребуется очень мало времени для включения ведения журнала времени работы с вашим мобильным приложением.

Ответ 16

Существует два варианта отладки или получения вывода вашего собственного собственного приложения при использовании

Эмулятор или реальное устройство

Для первого использования эмулятора: используйте

реактивный лог-андроид или реактивный лог-иос

чтобы получить вывод журнала

на реальном устройстве. встряхните ваше устройство

поэтому откроется меню, в котором вы выбираете удаленную отладку, и откроется этот экран в вашем браузере. так что вы можете увидеть свой вывод журнала на вкладке консоли. enter image description here

Ответ 17

enter image description here Использовать собственный отладчик реагирования для ведения журнала и редукционного хранилища https://github.com/jhen0409/react-native-debugg

Просто скачайте его и запустите как программное обеспечение, затем включите режим отладки из симулятора.

Он поддерживает другую функцию отладки, такую же как элемент в инструментах разработчика Chrome, которая помогает увидеть стили, предоставленные для любого компонента.

Последняя полная поддержка для инструментов редукционного разработчика

Ответ 18

Вы можете использовать удаленную опцию js debugly со своего устройства или вы можете просто использовать реактивный лог-андроид и реактивный лог-лог для ios.

Ответ 19

console.log() - это простой способ отладки вашего кода, но его нужно использовать с функцией стрелки или bind() при отображении любого состояния. Вы можете найти ссылку полезной.

Ответ 20

Вы можете сделать это в 2 метода

1> используя предупреждение

console.warn("somthing " +this.state.Some_Sates_of_variables);

2> С помощью Alert. Это не хорошо каждый раз, когда он достигает оповещения, тогда каждый раз будет открываться pop, поэтому, если делать зацикливание означает, что не желательно использовать это

Import the {Alert} from 'react-native'
   // use this alert
   Alert.alert("somthing " +this.state.Some_Sates_of_variables);

Ответ 21

Пользователи с Windows и Android Studio:

Вы найдете его в Logcat в Android Studio. Здесь появляется много сообщений регистрации, поэтому вам может быть проще создать фильтр для "ReactNativeJS", который будет отображать только ваши сообщения console.log, созданные внутри вашего собственного собственного реагирующего приложения.

Ответ 22

Каждый разработчик, сталкивавшийся с проблемой отладки с помощью собственного адаптера, даже я сталкивался с этим, и я ссылаюсь на это, и решение достаточно для меня на начальном уровне, оно охватывает несколько способов, которые помогают нам попробовать и использовать то, что когда-либо нам было удобно

  1. Отладка с помощью console.log
  2. Отладка кода (логики) с помощью Nuclide
  3. Отладка кода (логики) с помощью Chrome
  4. Используйте XCode для отладки графического интерфейса

https://codeburst.io/react-native-debugging-tools-3a24e4e40e4

Ответ 23

  1. Поместите console.log("My log text") в свой код
  2. перейти к инструментам командной строки
  3. позиционировать себя в папке для разработчиков

В Android:

  • напишите эту команду: React-native log-android

В IOS:

  • написать эту команду: React-native log-ios

Ответ 24

Вы также можете использовать Reactotron, он даст вам гораздо больше функциональности, чем просто регистрация.https://github.com/infinitered/reactotron

Ответ 25

console.log() - лучший и простой способ увидеть ваш лог на консоли, когда вы используете удаленный отладчик js из меню разработчика

Ответ 26

Chrome Devtool - лучший и самый простой способ для регистрации и отладки.

Ответ 27

Если вы используете osx и используете эмулятор, вы можете просмотреть файл console.log непосредственно в веб-инспекторе safari.

Safari => Разработка => Симулятор - [ваша версия симулятора здесь] => JSContext

Ответ 28

Просто console.log('debug');

И запустить его вы можете увидеть журнал в строке терминала /CD.

Ответ 29

Обычно есть два сценария, где нам нужна отладка.

  1. Когда мы сталкиваемся с проблемами, связанными с данными, и мы хотим проверить наши данные и отладку, связанную с данными, в этом случае console.log('data::',data)

    и отладка JS удаленно является лучшим вариантом.

  2. Другой случай - это проблемы, связанные с пользовательским интерфейсом и стилями, где мы должны проверить стилизацию компонента, в этом случае оптимальным вариантом является response-dev-tools.

    оба метода упоминаются здесь.

Ответ 30

console.log можно использовать для любого проекта JS. Если вы запускаете приложение в localhost, то очевидно, что оно похоже на любой проект javascript. Но при использовании симулятора или любого устройства подключите этот симулятор к нашему локальному хосту, и мы увидим в консоли.