拒绝特定浏览器访问我的应用

Question

寻找一些我可以添加到我的reactjs应用程序的代码，当使用Firefox访问我的应用程序时会向用户显示错误....不支持浏览器类型之类的东西。

import './App.css';
import { BrowserRouter as Router, Route, Link, Switch, Redirect } from 'react-router-dom';
import Home from './components/Home';
import Test from './components/Test';
import Test1 from './components/Test1';

class App extends Component {
  render() {
    return (
      <Router>
        <div>
          <Navbar />
          <Switch>
            <Route exact path="/" component={Home} /> <Route exact path="/home" component={Home} /> <Route exact path="/test" component={Test} /> <Route exact path="/test1" component={Test1} />
            <Route component={NoMatch} />
          </Switch>
        </div>
      </Router>
    );
  }
}
export default App;

在线我看到了一些内容，但我不确定在哪里应该添加到我的app.jsx或我的index.html或index.jsx ......

请找一个可能对我有个例子的人

Answer 1

试试这个

import './App.css';
import { BrowserRouter as Router, Route, Link, Switch, Redirect } from 'react-router-dom';
import Home from './components/Home';
import Test from './components/Test';
import Test1 from './components/Test1';

class App extends Component {

  render() {
  if(navigator.userAgent.indexOf("Firefox") > 0) {
      return <div>Browser not supported </div>
    }
    return (
      <Router>
        <div>
          <Navbar />
          <Switch>
            <Route exact path="/" component={Home} /> <Route exact path="/home" component={Home} /> <Route exact path="/test" component={Test} /> <Route exact path="/test1" component={Test1} />
            <Route component={NoMatch} />
          </Switch>
        </div>
      </Router>
    );
  }
}
export default App;