使用 console.log 记录反应本机事件未触发并最终使应用程序崩溃 [英] logging react native event with console.log not firing and eventually crashes the app

问题描述

在 react-native 中向 ScrollView 添加事件时，我注意到事件处理程序没有触发，应用程序最终会在几秒钟后静默崩溃.

When adding an event to a ScrollView in react-native, I noticed the event handler was not firing, and the app will eventually and silently crash after a few seconds.

这就是我的处理程序的样子，我所做的只是一个简单的 console.log 事件:

This is what my handler looked like, all I was doing was a simple console.log on the event:

// Does not work:
<FlatList
  ...
  onScrollEndDrag={e => {
    console.log(e);
  }}
  ...
/>

我注意到如果我不传递参数，事件处理程序就起作用了:

I noticed that if I didn't pass the parameter, the event handler worked:

// Works:
<FlatList
  ...
  onScrollEndDrag={e => {
    console.log('event');
  }}
  ...
/>

但我无法访问我的活动数据.

But I can't access my event data.

为什么当我尝试在此处使用 console.log 访问事件时，事件处理程序会失败?

Why is the event handler failing when I try to access the event with console.log here?

推荐答案

我找到了一个解释github:

问题可能是事件对象具有循环或不可序列化的字段.尝试记录 event.nativeEvent(它是 ViewLayout 对象).

The problem may be that the event object has fields that are cyclic or otherwise unserializable. Try logging event.nativeEvent (which is the ViewLayout object) instead.

这是由于 expo (XDE) 如何实现 console.logging 通过使用 pretty-format 序列化数据.

This is due to how expo (XDE) implements console.logging to send data from a device to the computer, by using pretty-format to serialize the data.

这确实是第 31 版 expo 中的一个错误.这已在 master 中修复，但我会在此处留下这个答案，以防它帮助任何人.

This is indeed a bug within expo as of version 31. This has been fixed in master, but I will leave this answer here in case it helps anyone.

解决方案是在 console.log 行中使用 e.nativeEvent 而不是 e，因为nativeEvent 没有循环引用.

The solution is to use e.nativeEvent rather than e in the console.log line, since the nativeEvent has no circular references.

这篇关于使用 console.log 记录反应本机事件未触发并最终使应用程序崩溃的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！