So far i solved this question by following way.
constructor(props){
super(props);
this.state = {
title: "Save",
savedId: [],
};
this.savePost = this.savePost.bind(this);
}
----------------------------------------------------------------------
savePost = (item, e) => {
if( item.save_post_status == false ){
this.state.savedId.push(item.id); //push each id in the savedId array.
this.setState({ title: "Post Saved" })
let savePostsAPI = API URL,
fetch( savePostsAPI , {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
})
}
}
Now in the html i used includes method for comparing the array values.
{ this.state.itemData.map((item,index) => {
let boundItemClick = this.savePost.bind(this, item);
<li>
<Link to="#!" className="trans" title="Save" data-id={item.id} onClick={boundItemClick}>
{ item.save_post_status === false ? this.state.savedId.includes(item.id) ? <img className="svg" src={ imgurl_after } alt="img" /> : <img className="svg" src={ imgurl_before } alt="img" />}
</Link>
</li>
}})