Why I get 'avoid using JavaScript unary operator as property name' in vue.js?

Question

In a vue.js template, I have this code to delete a joke

<div  v-on:click="delete(joke)" class="btn btn-sm">delete</div>

and the method to do so:

delete: function(joke) {
    console.log('delete requested');
    axios.post( this.BASE_URL + "/delete" , {
        id: joke.id,
        token: this.token,
    }).then( (res) => { 
        this.$router.push({ path: '/' });
    })
    .catch( (error) => {
        console.log(error);             
  });
},

I get this error:

avoid using JavaScript unary operator as property name: "delete(joke)" in expression v-on:click="delete(joke)"

The odd thing is that, in other components, I pass the same joke object to methods in the same manner and get no errors.

I'm wondering what is wrong here and how to fix it?

Answer 1

I'm wondering what is wrong here

delete is an operator defined in JavaScript.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete

and how to fix it?

Choose a different method name than delete ...