Vuetify菜单不起作用:属性或方法"on"未在实例上定义，但在渲染过程中被引用

问题描述

我要从官方文档Vuetify中复制关于菜单的第一个示例，但结果是错误:

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

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

推荐答案

我在Vuetyfy 1.4.4和Vue 2.5中有相同的问题.更新此软件包可解决问题.在vue 2.6.9和vuetify 1.5.6中，v-slot:activator ="{}}"属性效果很好.通过以下方式检查您过时的包裹npm outdated --depth=0然后更新它们npm update vuetyfy vue etc.

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 bynpm outdated --depth=0and then update them bynpm update vuetyfy vue etc.

这篇关于Vuetify菜单不起作用:属性或方法"on"未在实例上定义，但在渲染过程中被引用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！