温馨提示:本文翻译自stackoverflow.com,查看原文请点击:vue.js - Unknown custom element:

vue.js - 未知的自定义元素:

发布于 2020-03-29 12:56:20

我正在尝试从我的父母HamburgerCross到我的孩子HamburgerMenu触发一个事件。但是,当我尝试使用hamburgerMenu名称注册组件时,它将开始引发错误。它说元素HamburgerMenu是未知的。我怎么解决这个问题?

<template>
      <div>
            <div class="grid-item-4">
                <HamburgerCross @onToggle="toggleHamburgerMenu" />
                <HamburgerMenu :links="links" ref="hamburgerMenu" />
            </div>
      </div>
    </template>

    <script>

    import ButtonItem from '@/components/widgets/clickables/button_item.vue'
    import LanguageSelect from '@/components/widgets/language_select.vue'
    import HamburgerCross from '@/components/widgets/navigation/hamburger_menu_cross.vue'
    import HamburgerMenu from '@/components/widgets/navigation/hamburger_menu.vue'
    export default {
        components:{
            ButtonItem,
            LanguageSelect,
            HamburgerCross,
            'hamburgerMenu' : HamburgerMenu,
        },
        data(){
            return{
                title: 'BLOCKBURN',
                links: {'About' : '/about', 'Dapp' : '/dapp', 'Game' : '/game', 'Roadmap' : '/roadmap'},
                defaultLanguage: 'uk',
                buttonText: 'BUY BURN IEO',
                buttonTheme: 'secondary',
            }
        },
        methods:{
            toggleHamburgerMenu(){
                console.log('toggle nav');
                this.$refs.hamburgerMenu.toggle();
            }
        }
    }
    </script>

查看更多

查看更多

提问者
OneDayFly
被浏览
67
Khairul Habib 2020-01-31 17:17
<template>
      <div>
            <div class="grid-item-4">
                <HamburgerCross @onToggle="toggleHamburgerMenu" />
                <HamburgerMenu :links="links" ref="hamburgerMenu" />
            </div>
      </div>
    </template>

    <script>

    import ButtonItem from '@/components/widgets/clickables/button_item.vue'
    import LanguageSelect from '@/components/widgets/language_select.vue'
    import HamburgerCross from '@/components/widgets/navigation/hamburger_menu_cross.vue'
    import HamburgerMenu from '@/components/widgets/navigation/hamburger_menu.vue'
    export default {
        components:{
            ButtonItem,
            LanguageSelect,
            HamburgerCross,
            HamburgerMenu,
        },
        data(){
            return{
                title: 'BLOCKBURN',
                links: {'About' : '/about', 'Dapp' : '/dapp', 'Game' : '/game', 'Roadmap' : '/roadmap'},
                defaultLanguage: 'uk',
                buttonText: 'BUY BURN IEO',
                buttonTheme: 'secondary',
            }
        },
        methods:{
            toggleHamburgerMenu(){
                console.log('toggle nav');
                this.$refs.hamburgerMenu.toggle();
            }
        }
    }
    </script>

删除'hamburgerMenu',就可以了。就像您在注释中提到要与ref一起使用ref一样,如果您在组件上注册它,就不会像短裙所说的那样产生影响

发布
问题

分享
好友

手机
浏览

扫码手机浏览