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

Question

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

Answer 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.