Hi have the following Antd modal:
<Modal visible={visible} onOk={handleOk} onCancel={handleCancel}>
<MyForm onSubmit={handleOpenUrl}>
<CustomInput
name="input"
onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
handleInput(event, "input")
}
/>
<Button type="submit" >
Submit
</Button>
</MyForm>
</Modal>;
And I have the following handler for this form:
const handleInput = (event: React.SyntheticEvent) => {
event.preventDefault();
// other operation where checked is handled...
history.push({
pathname: "/",
search: "?" + new URLSearchParams({ datas: checked }).toString(),
});
};
the weird thing is that when I open the form and I submit the form for the first time it update the url and add it like the following: http://localhost:3000/?datas=myqueryparams but when I do it for the second time it says: TypeError: Cannot read properties of undefined (reading 'push')
Any ideas about that?
UPDATE
for app component I have added the following:
<Switch>
<Route path="/?datas=:datas" exact component={App} />
<Route path="/" exact component={App} />
</Switch>
have you wrapped the app component with BrowserRouter from react-router-dom ?
example code like this
import React from "react";
import {
BrowserRouter as Router
} from "react-router-dom";
export default function App() {
return (
<Router>
<ChildComponent />
</Router>
);
}