javascript - _vm.myFunction 未定义，在 VueJs

Question

我是 VueJs 世界的新手，我对 v-on:click 函数有疑问。这是一个例子：

JS & HTML

var myNav = new Vue({
    el: '#componentNav',
    methods: {
        currentComponentChanger: function (pageName) {
            alert(pageName)
        }
    }
});

var myPage = new Vue({
    el: '#mainComponents',
    data: {
        currentComponent: 'home'
    }
})

 <nav id="componentNav">
            <ul>
                <li class="active li"><a class="home active"><button v-on:click="currentComponentChanger('home')">Acceuil</button></a></li>
                <li class="li"><a class="tower"><button v-on:click="currentComponentChanger('tower')">Tower Ascension</button></a></li>
                <li class="li"><a class="faq"><button v-on:click="currentComponentChanger('faq')">F.A.Q.</button></a></li>
                <li class="li"><a class="follow"><button v-on:click="currentComponentChanger('follow')">Nous suivre</button></a></li>
            </ul>
        </nav>

而不是警报，使用 currentComponentChanger() 函数，会发生错误并说“ _vm.currentComponentChanger is not defined ”。我不明白为什么，我对官方文档的例子也有同样的问题。

标签： javascripthtmlvue.js