how to create alert confirm box in vue

Try this

<a href="javascript:;" v-on:click="DeleteUser(artist.id, index)">Delete</a>

DeleteUser(id, index) {

   if(confirm("Do you really want to delete?")){

                axios.delete('/api/artist/'+id)
                .then(resp => {
                    this.artists.data.splice(index, 1);
                })
                .catch(error => {
                    console.log(error);
                })
   }
},

Simply use if(confirm('are you sure?')) inside DeleteUser.

DeleteUser(id, index) {
    if(confirm('are you sure?'))
        axios.delete('/api/artist/'+id)
          .then(resp => {
          this.artists.data.splice(index, 1);
        })
          .catch(error => {
          console.log(error);
        })
},

and remove the onClick

Demo https://jsfiddle.net/jacobgoh101/ho86n3mu/4/

You can install an alert library (Simple Alert) from here for more beautiful view

And then, you can use options to show alert box with question or anything else. This library has a few option. You can see them if you check above link.

this.$confirm("Are you sure ?", "Class is deleting...", "question").then(()=>{

           axios.delete("/classes/" + studentClass.id).then(response =>{
                this.$alert(response.data.message, 'Succes', 'success');
           }).catch(error => {
               this.$alert(error.response.data.message, 'Hata', 'error');
           });

       });

Description of alert box with parameters :

this.$confirm('Message is here', "Title is here", "type is here like success, question, warning");