私はJSをTSに移行しており、変更されたコードにエラーが発生しています。
26行目:8:解析エラー: '>'が予想される
_import React from "react";
import { Route, Redirect, RouteProps } from "react-router-dom";
import {render} from "react-dom"
import {AppProps} from "../App"
function querystring(name: string, url = window.location.href) {
name = name.replace(/[[]]/g, "\\$&");
const regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)", "i");
const results = regex.exec(url);
if (!results) {
return null;
}
if (!results[2]) {
return "";
}
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
export default function UnauthenticatedRoute({ component: C, appProps, ...rest }:
RouteProps & {appProps: AppProps}) {
const redirect = querystring("redirect");
return (
<Route
{...rest} // the issue is here
render={ props => !appProps.isAuthenticated ?
<C {...props} {...appProps} />
:
<Redirect to={redirect === "" || redirect === null ? "/" : redirect}/>
}
/>
);
}
_
誰かが問題を見れば、それは親切になります:)。ありがとう!
1 /ファイルにはTSX拡張子が必要です
TSX構文では2 /構文も間違っていました。私はこれに変更されました、そして今それは大丈夫です:
_export default function UnauthenticatedRoute({ component: C, appProps, ...rest }:
RouteProps & {appProps: AppProps}) {
const redirect = querystring("redirect");
return (
<Route {...rest}
render={ props => !appProps.isAuthenticated ?
<C {...props} {...appProps} />
:
<Redirect to={redirect === "" || redirect === null ? "/" : redirect}/>
}
/>
);
}
_
今、私はバインディング要素 'c'の別の問題がありますが、それは別の物語です。
みんな、ありがとう!
ファイル拡張子を.ts
から.tsx
に変更します。
注意:React-DOMを返すときは、必ずTSXを使用してくださいTSを使用してください。