uni-app 微信小程序出现这个问题 Error in onShow hook: "ReferenceError: NodeList is not defined"

在 uni-app 开发微信小程序时遇到 Error in onShow hook: "ReferenceError: NodeList is not defined" 错误，通常意味着你的代码中有部分不兼容 Web 环境而在小程序环境中无法识别的 API 调用。NodeList 是 Web API 的一部分，在微信小程序等类原生环境中并不存在。

以下是一些可能的原因及相应的解决方案，主要通过代码示例展示如何避免这类问题：

1. 检查第三方库

如果你使用了第三方库，这些库可能试图在小程序环境中使用 NodeList。你可以尝试以下方式解决：

• 使用条件编译：在 uni-app 中，你可以使用条件编译来区分微信小程序和其他平台。例如，为微信小程序提供特定的库版本或替代实现。

// #ifdef MP-WEIXIN
// 使用微信小程序的兼容代码或库
import weixinSpecificLib from './weixin-specific-lib';
// #endif

// #ifndef MP-WEIXIN
// 使用Web标准的库
import standardLib from './standard-lib';
// #endif

• 替换或修改库：如果可能，查找并替换那些不兼容的库，或者自己实现所需功能。

2. DOM 操作替代

在 Web 开发中，NodeList 通常与 DOM 操作相关。微信小程序使用 WXML 和 WXSS，不直接支持 DOM 操作。你应该使用小程序的数据绑定和事件处理机制。

// 错误示例（尝试在小程序中使用 DOM 操作）
// let nodeList = document.querySelectorAll('.some-class'); // 这将抛出错误

// 正确示例（使用小程序的数据绑定）
Page({
  data: {
    items: []
  },
  onLoad() {
    // 模拟获取数据
    this.setData({
      items: [/* 数据数组 */]
    });
  }
});

在 WXML 中：

<view wx:for="{{items}}" wx:key="index">
  {{item.name}}
</view>

3. 全局变量检查

如果错误是由全局变量污染引起的（例如，某个库错误地假设了 NodeList 的存在），确保你的代码和所有依赖库都正确隔离和初始化。

结论

解决 NodeList is not defined 错误的关键在于识别并移除或替换不兼容的代码。在 uni-app 开发微信小程序时，应充分利用小程序的数据绑定和事件系统，避免直接使用 DOM 操作或依赖于 Web API 的代码。通过上述方法，你可以有效避免此类错误，确保应用在不同平台上的兼容性。