10

I am copying an first example from the official documentation Vuetify about Menus, but the result is an error :

"Property or method "on" is not defined on the instance but referenced during render".

<template>
        <v-app>
            <div class="text-xs-center">
                <v-menu offset-y>
                    <template v-slot:activator="{ on }">
                        <v-btn
                                color="primary"
                                dark
                                v-on="on"
                        >
                            Dropdown
                        </v-btn>
                    </template>
                    <v-list>
                        <v-list-tile
                                v-for="(item, index) in items"
                                :key="index"
                                @click=""
                        >
                            <v-list-tile-title>{{ item.title }}</v-list-tile-title>
                        </v-list-tile>
                    </v-list>
                </v-menu>
            </div>
        </v-app>
    </template>
    
    <script>
        export default {
            data: () => ({
                items: [
                    { title: 'Click Me' },
                    { title: 'Click Me' },
                    { title: 'Click Me' },
                    { title: 'Click Me 2' }
                ]
            })
        }
    </script>
Toodoo
  • 8,570
  • 6
  • 35
  • 58
Julia
  • 101
  • 1
  • 3
  • 1
    https://stackoverflow.com/questions/56087618/vue-js-vuetify-menu-named-slot-activator-is-not-binding-to-the-template-but-g – Dani Andújar Oct 02 '19 at 14:50

2 Answers2

9

I had the same issue in Vuetyfy 1.4.4 and Vue 2.5. Updating this packages fixed problem. In vue 2.6.9 and vuetify 1.5.6 attribute v-slot:activator="{ on }" works great. Check your outdated packages by npm outdated --depth=0 and then update them by npm update vuetyfy vue etc.

gunter
  • 97
  • 6
1

In my case work but browser showed warning, adding on prop remove warning for me using vuetify 2.2.4

props: ['on']

Edit: My problem was that I was using v-on="on" outside of template that was declaring with v-slot, remove it worked for me

Francisco Rodeño Sanchez
  • 607
  • 1
  • 9
  • 15