Методы Parent/Child в Vue JS

Я пытаюсь вызвать метод в дочернем экземпляре VUE и не могу понять, почему он не работает.

Мое Vue выглядит следующим образом:

родитель

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

ребенок

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

Любые идеи о том, почему это не подобрать метод на дочернем экземпляре? Я вызываю метод внутри дочернего элемента.

Изменить мою HTML-разметку следующим образом:

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

1 ответ

Решение

Исходя из того, что я вижу здесь, ваша проблема в том, что вы создаете два экземпляра Vue. Становится трудно обмениваться данными и методами между экземплярами. Гораздо проще создать один экземпляр и использовать компоненты для выполнения работ. Некоторое чтение: http://vuejs.org/guide/components.html

Другие вопросы по тегам