react.js 无状态组件在导入时给出“无效”错误

Question

当我尝试将无状态组件导入到我的 App.js 以运行时，我收到错误 type is invalid。当我在 App.js 中运行相同的代码时，它工作得很好，但是当我导入它时，它会中断。这里的解决方案是什么？发生了什么？

提前谢谢你

我的mobile.js

import React from 'react';

//this part will be imported via a component.  Need to check and make sure how to update state via component.
const checkIfMobile = {
  Android: function() {
    return navigator.userAgent.match(/Android/i);
  },
  BlackBerry: function() {
    return navigator.userAgent.match(/BlackBerry/i);
  },
  iOS: function() {
    return navigator.userAgent.match(/iPhone|iPad|iPod/i);
  },
  Opera: function() {
    return navigator.userAgent.match(/Opera Mini/i);
  },
  Windows: function() {
    return navigator.userAgent.match(/IEMobile/i);
  },
  any: function() {
    return (
      checkIfMobile.Android() ||
      checkIfMobile.BlackBerry() ||
      checkIfMobile.iOS() ||
      checkIfMobile.Opera() ||
      checkIfMobile.Windows()
    );
  }
};

export default checkIfMobile;

它被导入 App.js 并给我type is invalid 错误。

import React, { Component } from 'react';
import ChromePluginNotice from '../components/banner/ChromePluginNotice';
import Content from './Content';
import Banner from './Banner';
import Footer from '../components/footer/Footer';
import checkIfMobile from '../components/banner/checks/mobile';

// //this part will be imported via a component.  Need to check and make sure how to update state via component.
// const checkIfMobile = {
//   Android: function() {
//     return navigator.userAgent.match(/Android/i);
//   },
//   BlackBerry: function() {
//     return navigator.userAgent.match(/BlackBerry/i);
//   },
//   iOS: function() {
//     return navigator.userAgent.match(/iPhone|iPad|iPod/i);
//   },
//   Opera: function() {
//     return navigator.userAgent.match(/Opera Mini/i);
//   },
//   Windows: function() {
//     return navigator.userAgent.match(/IEMobile/i);
//   },
//   any: function() {
//     return (
//       checkIfMobile.Android() ||
//       checkIfMobile.BlackBerry() ||
//       checkIfMobile.iOS() ||
//       checkIfMobile.Opera() ||
//       checkIfMobile.Windows()
//     );
//   }
// };

export default class App extends Component {
  constructor() {
    super();
    this.state = { isMobile: checkIfMobile.any() };
  }
  render() {
    const { isMobile } = this.state; // destructure isMobile to variable

    return (
      <div>
        <ChromePluginNotice />

        <Banner isMobile={isMobile} />
        <Content isMobile={isMobile} />
        <Footer />
      </div>
    );
  }
}

不知道如何从这里修复它。完整的错误是

invariant.js?4599:44 Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. Check the render method ofStatelessComponent.

Answer 1

这是一些恶意代码，试图访问我的 mobile.js 的旧版本，现在一切正常。