I have a list, and I need to delete an element to be deleted.

The delete button works in that it sends the delete request to the server. However, a page refresh is needed to have it delete from the front end.

I want it deleted after the delete button is clicked.

I could simply set a boolean on the front end as follows:

```
render && <ComponentToDelete />

```

and change `render` from **true** to **false**.

Is this the preferred way or is there a best practice or more standard way.

I'm simply doing a delete on an item as part of CRUD operations.

I'm not sure if this is relevant:

<https://reactjs.org/docs/react-dom.html#unmountcomponentatnode>

Also, per comment here is how the list is generated:

```
    let render;
    if(new_articles.length > 1){
      render = new_articles.map((val, index) => {
        return <ComponentArticle key={index} data={val}/>;
      });            
    }
    return render;   

```

[google search here](https://www.google.com/search?rlz=1C5CHFA_enUS895US895&sxsrf=ALeKk00lomTvrZ_UWucPeiYpvOIxktf_8Q%3A1605671914732&ei=6pu0X9uHLIGctgWcw5zQDw&q=react%20how%20to%20unmount%20%2F%20delete%20a%20component&oq=react%20how%20to%20unmount%20%2F%20delete%20a%20component&gs_lcp=CgZwc3ktYWIQAzIFCAAQzQIyBQgAEM0CMgUIABDNAjIFCAAQzQI6BAgAEEc6BAgjECc6BggAEAgQHjoECAAQHjoGCAAQDRAeOgQIIRAKULxAWNhPYPBhaABwA3gAgAFeiAHFBZIBATmYAQCgAQGqAQdnd3Mtd2l6yAEIwAEB&sclient=psy-ab&ved=0ahUKEwjbpOmAmovtAhUBjq0KHZwhB_oQ4dUDCA0&uact=5)