I want to list the elements of the objects in my Typescript react project.
If I make in this way:
const data = Dependencies.backend.getList(caseDetailUrl + this.props.id);
data.then(res => {
console.log(res)
})
The output is but when I refresh page it prints 2 times I don’t know why:
{
"id": "669f83",
"creation_date": "2022-01-13 10:33:06.046652+01:00",
"case_type": "Sum",
"current_stage": "",
"last_change_date": "2022-01-14 14:35:17.563449+01:00",
"status": 1,
}
I want to display these info but I can’t.
Firstly, I try:
let case_value
data.then(res => {
case_value.push(res)
})
and It shows an error:
Uncaught (in promise) TypeError: Cannot read properties of undefined (reading ‘push’)
And when I use .map instead of .then
Property ‘map’ does not exist on type ‘Promise<unknown[] | undefined>’.ts(2339)
My whole code is:
import React from "react";
import { Dependencies } from "../../../shared/utils/dependencies";
import { caseDetailUrl } from "../../constants/backend-constants";
interface CaseDetailProps {
id: string,
}
class CaseDetail extends React.Component<CaseDetailProps> {
render() {
const data = Dependencies.backend.getList(caseDetailUrl + this.props.id);
let case_value
data.then(res => {
case_value.push(res)
})
return (
<div className="caseDetail">
<h1>Hi!</h1>
<h3>{this.props.id}</h3>
</div>
);
}
}
export default CaseDetail;
How can I display it?