ReactJS应用程序不能在IOS和IE/Edge上工作

Question

希望我们能尽快解决这个问题：

我的reactjs项目在构建和部署后，正在chrome和firefox上工作--在windows和Android上。然而，在IE、Edge和Safari（在IOS上也是chrome）上，我会得到一个带有以下错误的空白页：

对于IE：

TypeError: Unable to get property 'index' of undefined or null reference
   {
      [functions]: ,
      __proto__: { },
      description: "Unable to get property 'index' of undefined or null reference",
      message: "Unable to get property 'index' of undefined or null reference",
      name: "TypeError",
      number: -2146823281,
      stack: "TypeError: Unable to get property 'index' of undefined or null reference
   at value (https://xxxx/static/js/main.9016f2a2.chunk.js:1:2786)
   at Za (https://xxxx/static/js/2.97b2c280.chunk.js:2:331602)
   at Ja (https://xxxx/static/js/2.97b2c280.chunk.js:2:331451)
   at ju (https://xxxx/static/js/2.97b2c280.chunk.js:2:366905)
   at Nl (https://xxxx/static/js/2.97b2c280.chunk.js:2:351180)
   at Al (https://xxxx/static/js/2.97b2c280.chunk.js:2:351108)
   at wl (https://xxxx/static/js/2.97b2c280.chunk.js:2:348431)
   at gl (https://xxxx/static/js/2.97b2c280.chunk.js:2:345175)
   at oc (https://xxxx/static/js/2.97b2c280.chunk.js:2:373109)
   at Anonymous function (https://xxxx/static/js/2.97b2c280.chunk.js:2:374484)",
      Symbol()_6.wutlnu1cxkj: undefined,
      Symbol(react.async_mode)_y.wutlnu1cxkj: undefined,
      Symbol(react.concurrent_mode)_x.wutlnu1cxkj: undefined,
      Symbol(react.context)_o.wutlnu1cxkj: undefined,
      Symbol(react.element)_i.wutlnu1cxkj: undefined,
      Symbol(react.forward_ref)_p.wutlnu1cxkj: undefined,
      Symbol(react.fragment)_k.wutlnu1cxkj: undefined,
      Symbol(react.fundamental)_u.wutlnu1cxkj: undefined,
      Symbol(react.lazy)_t.wutlnu1cxkj: undefined,
      Symbol(react.memo)_s.wutlnu1cxkj: undefined,
      Symbol(react.portal)_j.wutlnu1cxkj: undefined,
      Symbol(react.profiler)_m.wutlnu1cxkj: undefined,
      Symbol(react.provider)_n.wutlnu1cxkj: undefined,
      Symbol(react.responder)_v.wutlnu1cxkj: undefined,
      Symbol(react.scope)_w.wutlnu1cxkj: undefined,
      Symbol(react.strict_mode)_l.wutlnu1cxkj: undefined,
      Symbol(react.suspense)_q.wutlnu1cxkj: undefined,
      Symbol(react.suspense_list)_r.wutlnu1cxkj: undefined
   }

TypeError: Unable to get property 'index' of undefined or null reference

SCRIPT5007: SCRIPT5007: Unable to get property 'index' of undefined or null reference

Answer 1

在几乎放弃之后，我已经找到了解决办法。我一直在一个接一个地重建项目，npm安装为npm安装，一个接一个代码块，直到我最终发现问题：

const language = navigator.language || navigator.userLanguage;

是的，一如既往，一行代码，打破了整个项目。你看，chrome和firefox在使用navigator获取浏览器语言时返回一个不同的值。

在我的例子中，Chrome和Firefox返回en，而edge返回en-de

在删除Header组件导入（以排除故障）之前，出现了相同的消息，但它不是索引，而是Header。我没有名为索引的组件。除了启动的index.js。因此，我假设reactjs在这些浏览器中有一个基本问题。我想它在获得文件结构react构建方面有问题？

当我在json中引用语言时，如下所示：

my_json[language]["index"]

索引是页面选择器，因此当选择器是

my_json[language]["header"]

这似乎是一个“问题”已经报告给chromium，它实际上是一个只返回语言而不返回国家代码的错误。

Chrome浏览器-导航。语言不返回国家代码

只返回语言：

const language = navigator.language.split("-")[0] || navigator.userLanguage.split("-")[0] || "en";

const country = navigator.language.split("-")[1] || navigator.userLanguage.split("-")[1] || "us";