#错误处理

#在工具中发现错误

当你开发 Lynx 应用时，可能会遇到各种类型的错误，旨在让你快速了解刚刚发生的意外情况。

例如，如果某个 URL 无效或者当前无法访问，你会看到这样的报错：

有时候，你的 JavaScript 代码会包含一个 TypeError：

有时候，调用原生模块时传入的参数数量不正确：

借助开发工具（DevTool）或者消息盒子（LogBox），你会很轻松地发现他们。

#消息盒子

正如你在上面已经看到的，这是一款用来显示错误的应用内工具

它便于快速浏览，让你知道发生了什么。不过，对于开发工作，我们推荐使用桌面调试工具，它有更丰富的功能和更好的交互体验。

#在代码中处理错误

现在让我们尝试对报错做些什么。

如果你想在代码中处理这些错误，可能会要先对错误有一个整体的理解。

然后，这里是一个处理 301 错误的例子

const ImageErrorExample = () => {
  const [isImageError, setImageError] = useState(false);
  const handleImageError = (event: ErrorEvent) => {
    setImageError(true);
    console.log('Image loaded error:', JSON.stringify(event));
  };
  if (isImageError) {
    return <view />;
  }
  return (
    <view>
      <image
        className="my-image"
        src={'error url'}
        binderror={handleImageError}
      />
    </view>
  );
};

为了让开发者能够快速分类错误并找到解决方法，我们总结了所有错误并整理了一份列表，包括错误代码、描述、级别、修复建议等。

请随意查阅！

#ReactLynx 诊断日志

有些问题只在你接不上 DevTool 的设备上复现。这种时候，可以让 ReactLynx 把自己正在做什么写进平台的原生日志：构建时用环境变量打开，然后用平台自己的工具去看——Android 用 adb logcat，iOS 用 Xcode 控制台。

下面两个开关默认都是关的，也都不该带上线。它们的输出量大到会影响你正在测的东西，只用来排查问题。

REACT_ALOG=true 会让 ReactLynx 把自己的状态流转打出来，主线程和后台线程都打，每行都带 [ReactLynxDebug] 前缀：

REACT_ALOG=true rspeedy build

你会看到：主线程发给后台线程的 OnLifecycleEvent 数据、两个线程在 hydration 前后的 snapshot 实例树、后台线程收到的事件、list 的更新，以及回灌到主线程的 patch。界面停在一个你解释不了的状态时用它——组件一直没 hydrate、事件没送到、list 渲染出了错位的项。每个阶段本该产出什么，见渲染流程与生命周期。

REACT_ALOG_ELEMENT_API=true 更低一层，它记录框架在主线程上发起的每一次 Element PAPI 调用，也就是搭建元素树的 create、append、update 操作，其中的元素会被渲染成 tag#uniqueId，方便你追踪同一个元素在多次调用中的去向：

[ReactLynxDebug] FiberElement API call #42: __AppendElement(view#3, text#7)

它比 REACT_ALOG 吵得多——一个屏幕就能打出上千行——所以先确定要看哪一次交互，再打开它。

#兼容性