Can't bind v-on:click on Vuetify [Vue warn]: Error in v-on handler: “TypeError: handler.apply is not a function”

问题

I am trying to bind a click event on dynamically generated subheader v-list-tile Vuetify https://vuetifyjs.com/en/components/subheaders but each time I click the option an error appears.

vue.js:634 [Vue warn]: Error in v-on handler: "TypeError: handler.apply is not a function"

found in

---> <VListTile>
       <VList>
         <VCard>
           <VApp>
             <Root>

I have tried adding the methods forcibly (without passing object) and it works. It just triggers when it is passed to an object and dynamically rendered.

Here is a Codepen of the bug I encountered.

What I am expecting is to trigger the method that is called without triggering an error

回答1:

My methods are inside the Data object. They should be at the same level.

In the Codepen example take the function name out of the data object and only left the number id.

By calling the function on the @click event and passing the number there made the method work.

回答2:

This happened to me because I coded something similar on a HTML tag:

@something="colorList"

Where colorList was a javascript object array. Instead, you have to write a function the value is passed to, and set the value inside the function:

<... @something="updateColorList" ...>

And in methods

updateColorList(newColorParameter): {
    this.colorList = newColorParameter
}

来源：https://stackoverflow.com/questions/56849142/cant-bind-v-onclick-on-vuetify-vue-warn-error-in-v-on-handler-typeerror