import axios from "axios";
import React, { useEffect, useState } from "react";
import { useParams } from "react-router-dom";
import { useFormik } from "formik";
function RelateEdit() {
const { relate_id } = useParams();
const [relate, setRelate] = useState();
useEffect(() => {
axios
.get(`http://localhost:3000/real-estate/${relate_id}`)
.then((data) => setRelate(data.data))
.catch((error) => console.log(error));
}, [relate_id]);
console.log(relate.advertHistory);
const formik = useFormik({
initialValues: {
advertHistory: relate.advertHistory,
buildingAge: relate.buildingAge,
city: relate.city,
deposit: relate.deposit,
district: relate.district,
dues: relate.dues,
floorLocation: relate.floorLocation,
furnished: relate.furnished,
heating: relate.heating,
neighbourhood: relate.neighbourhood,
numberOfBathrooms: relate.numberOfBathrooms,
numberOfRooms: relate.numberOfRooms,
situation: relate.situation,
title: relate.title,
url: relate.url,
},
onSubmit: (values) => {
axios
.put(`http://localhost:3000/real-estate/${relate_id}`, values)
.then((res) => console.log(res))
.catch((error) => console.log(error));
},
});
return (
<div>
{relate_id && relate && (
<div>
<form onSubmit={formik.handleSubmit}>
<input
type="text"
onChange={formik.handleChange}
name="advertHistory"
value={formik.values.advertHistory}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="buildingAge"
value={formik.values.buildingAge}
/>{" "}
<br />
<input
type="text"
onChange={formik.handleChange}
name="city"
value={formik.values.city}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="deposit"
value={formik.values.deposit}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="district"
value={formik.values.district}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="dues"
value={formik.values.dues}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="floorLocation"
value={formik.values.floorLocation}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="furnished"
value={formik.values.furnished}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="heating"
value={formik.values.heating}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="neighbourhood"
value={formik.values.neighbourhood}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="numberOfBathrooms"
value={formik.values.numberOfBathrooms}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="numberOfRooms"
value={formik.values.numberOfRooms}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="situation"
value={formik.values.situation}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="title"
value={formik.values.title}
/>
<br />
<input
type="text"
onChange={formik.handleChange}
name="url"
value={formik.values.url}
/>
<button type="submit">Güncelle</button>
</form>
</div>
)}
</div>
);
}
export default RelateEdit;
我得到这个错误，请帮助
当你的应用程序第一次渲染时，在相关的状态中没有任何内容，直到你的API的响应被检索。在您的响应被存储在状态后，您可以访问数据。
try null safety:relate?.advertHistory