I doing delete function to delete banner image. I have create a delete function as below:
const [del, setDel] = useState([]);
const DeleteBanner = async (banner) => {
setDel(banner);
console.log(del);
Axios.delete(`/shop/${shopID}/banners`, del)
.then((res) => {
if (res.status === 200) {
setMessage({
data: `${res.data.MESSAGE}`,
type: "alert-success",
});
onShowAlert();
}
})
.catch((err) => {
setMessage({
data: err.response.data.MESSAGE,
type: "alert-danger",
});
setLoading(false);
onShowAlert();
});
};
return (
<div className="">
{shopData.data.ShopBanner.map((banners) => (
<Col
md="6"
xs="12"
className="p-0 m-0"
key={`img-${banners}`}
href="#pimage"
>
<img
className="border border-white"
key={`img-${banners}`}
src={`/api/v2/public/Shop/${shopID}/banner/${encodeURIComponent(
banners
)}`}
style={{ padding: "5px" }}
width="100%"
height="100%"
alt="banner"
/>
<Button
className="btn-link"
value={banners}
onClick={(e) => {
DeleteBanner(e.target.value);
}}
>
Delete
</Button>
</Col>
))}
</div>
)
then I display the banner image from the database and add a delete button set the value to banners (which is the image id )
when I try to delete, I'm getting the error 415 Unsupported Media Type, I'm not sure what went wrong. The post method for post the banner image is in fromdata which I success to post but has problem in delete
Axios accepts two parameters: url and optional config. You can use config.data to set the response body as follows:
Refer : https://github.com/axios/axios/issues/897
axios.delete(URL, {
headers: {
'Accept': 'application/json'
},
data: del
});