Parent/Child Vue JS 中的方法

Question

我试图在 child VUE 实例中调用一个方法，但我不明白为什么它似乎不起作用。

我的vue如下：

Parent

var content = new Vue({
    el: '.content-container',
});

Child

var vm = new Vue({
    el: '#form',
    parent: content,
    data: {
        postcode: null,
    },
    methods: {
        lookupAddress: function (event) {
            event.preventDefault();
            // Lookup Address
        },
    },
});

但是，我在 Vue Dev Tools 中不断收到以下错误：v-on:click="lookupAddress" expects a function value, got undefined

关于为什么它没有在 child 实例上获取方法的任何想法？我在 childs 元素中调用方法。

编辑我的 HTML 标记如下：

<body>
    <div class="content-container">
        <form id="form">
            ...
        </form>
    </div>
</body>

Answer 1

根据我在这里看到的情况，您的问题是您正在创建两个 Vue 实例。在实例之间共享数据和方法变得困难。创建单个实例并使用组件来完成腿部工作要简单得多。一些阅读：http://vuejs.org/guide/components.html

Parent/Child Vue JS 中的方法

Parent/Child methods in Vue JS

javascript

vue.js

vuex