Refresh Boostrap-Vue table after deleting a row

try to remove that post with the given id after the successful delete :

     axios.delete('/api/products/' + id)
                .then(response => {
                 this.posts= this.posts.filter(post=>post.id!=id)

                });
    

The deleteItem method should be like this:

        deleteItem(id) {
            axios.delete('/api/products/' + id)
                .then(response => {
                   const index = this.posts.findIndex(post => post.id === id) // find the post index 
                   if (~index) // if the post exists in array
                     this.posts.splice(index, 1) //delete the post
                });

        },

So basically you don't need any refresh. If you remove the item for posts array Vue will automatically handle this for you and your table will be "refreshed"