nuxt asynData Cannot read properties of undefined (reading ‘_isDestroyed‘)

发现的问题：

在nuxt服务端渲染遇到打包发版后出现

同时页面提示 

问题查找：

在aysncData上打印服务端渲染获取接口后的值，如下

在本地运行npm run build 然后执行npm run start 打开对应页面刷新

可以发现在服务端渲染时 终端上打印出来的是 接口报错 所以获取到的列表接口为空 

因为asyncData方法会在组件（限于页面组件）每次加载之前被调用。它可以在服务端或路由更新之前被调用。

所以可以看到客服端渲染时控制台

 

 代表在客服端渲染时，接口返回正常。

原因：

由于服务端渲染与客服端渲染返回的数据不一致，出现客户端渲染的虚拟 DOM 树与服务器渲染的内容不一致的情况。 导致在客服端渲染时列表遍历提示没有对应的节点

解决：

查找服务端渲染与客户端渲染不一致原因。

请求协议是否一致，请求域名是否一致等。

注意asyncData需要完整请求路径，所以可以通过获取当前服务ip地址配置对应服务域名

import * as os from 'os';
function getIPAdress() {
  const interfaces = os.networkInterfaces();
  for (const key in interfaces) {
    const iface = interfaces[key];
    for (let i = 0; i < iface.length; i++) {
      const alias = iface[i];
      if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal) {
        return alias.address;
      }
    }
  }
}