javascript - Safari 报告 "Unexpected token ' const' “当我打开我的 React 应用程序时

Question

我在 Safari 中打开我的 React 应用程序时遇到问题，尤其是我的私有(private)路由。错误:

SyntaxError: Unexpected token 'const'

我有普通的刷机功能:

function App() {
  return (
    <Router history={history}>
      <Switch>
        <Route path="/" exact component={Home} />
        <Route path="/login" component={Login} />
        <PrivateRoute path="/dash" component={Dashboard} />
        <PrivateRoute path="/filters" component={Filters} />
        <PrivateRoute path="/profile" component={Profile} />
        <PrivateRoute path="/map" component={Map} />
        <PrivateRoute path="/bookmarks" component={Bookmarks} />
        <PrivateRoute path="/client/:planID/:isLarge" component={Client} />
        <PrivateRoute
          path="/analyses/:planID/:isLarge"
          component={Analyses}
        />
      </Switch>
    </Router>
  );
}

问题出在这个 PrivateRoute 上，因为当我删除导入和标签时，它没有显示错误。这是我的私有(private)路线文件:

import React from "react";
import { Route, Redirect } from "react-router-dom";

const PrivateRoute = ({ component: Component, ...rest }) => {
  return (
    <Route
      {...rest}
      render={props =>
        sessionStorage.getItem("Token") ? (
          <Component {...props} />
        ) : (
          <Redirect to="/login" />
        )
      }
    />
  );
};
export default PrivateRoute;

我怀疑返回的某些东西不适合 Safari，但我不知道是什么。这在 Chrome、Mozilla、IE 和 Edge 上也以这种方式工作。只有 Safari 有问题。

更新:

这是 Safari 中问题的截图:

Answer 1

修复了!问题是箭头函数声明。 Safari 5.1 真的很糟糕，为了适应所有浏览器，最好避免使用 ES6 语法箭头函数。从此:

const PrivateRoute = ({ component: Component, ...rest }) => {
  return (
    <Route
      {...rest}
      render={props =>
        sessionStorage.getItem("Token") ? (
          <Component {...props} />
        ) : (
          <Redirect to="/login" />
        )
      }
    />
  );

我将代码转换为:

function PrivateRoute({ component: Component, ...rest }) {
  return (
    <Route
      {...rest}
      render={function(props) {
        return sessionStorage.getItem("Token") ? (
          <Component {...props} />
        ) : (
          <Redirect to="/login" />
        );
      }}
    />
  );