I am migrating js to ts and have an error with my modified code:
Line 26:8: Parsing error: '>' expected
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}/>
}
/>
);
}
If someone sees the problem, that would be kind :). Thanks!
1/ File needs to have tsx extension
2/ syntax was also wrong in the tsx syntax. I changed to this and now it's ok:
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}/>
}
/>
);
}
Now I have another issue with binding element 'C', but it's another story.
Thanks everyone!
With a little bit of digging into the library code, you can find the exact type of event and refactor. If you doing async calls and need to wait for results and use await when there is no need you will get a lint error message.
error Parsing error: ',' expected at the last 3 lines of the code. This is the correct error. Your code is invalid. This is why you should avoid long complex lines like that. Check the bracket matching on your last line. Sorry, something went wrong. @bradzacher yeah, agreed. This code is invalid.
error Parsing error: ',' expected at the last 3 lines of the code. This is the correct error. Your code is invalid. This is why you should avoid long complex lines like that. Check the bracket matching on your last line.
Not specifying attributes in certain components can produce lint error messages. For example, a button needs the button type and lists in React needs a key; Keys help React identify which items have changed, are added, or are removed.
Change the file extension from .ts
to .tsx
.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With