v-on:click 需要一个函数值，未定义答案

【问题标题】：v-on:click expects a function value, got undefinedv-on:click 需要一个函数值，未定义
【发布时间】：2016-12-28 06:14:09
【问题描述】：

我正在尝试学习 vuejs，目前正在尝试对按钮按下做出反应，但 v-on:click 指令（显然）找不到我添加到组件中的方法。

这是我的组件：

<template>
    <!-- super big form ... -->      
            <div class="card-content">     
            <div class="card-action">
                <a class="waves-effect waves-light btn blue darken-4" v-on:click="createOrganization">Guardar</a>
                <a class="waves-effect waves-light btn red darken-4">Limpiar</a>
            </div>
        </div>
    </div>
</template>

<script>
    var Vue = require('vue');

    module.exports.addOrganization = new Vue({
        name: 'addOrganization',
        methods: {
            createOrganization: function(event){
                event.preventDefault();
                alert("0");
            }
        }
    });
</script>

这是父组件

<template>  
    <div id="navbar">
        <navbar></navbar>
    </div>
        <router-view></router-view>
</template>

<script>
    var nav = require('./src/components/navbar.vue');
    module.exports = {
        data () {
            return {
                var: "hi",
            }
        },
        components: {
            'navbar': nav
        }
    }
</script>

这是主文件

var VueRouter = require('vue-router');
var addOrg = require('./src/components/addOrganization.vue');
var Vue = require('vue'); 
var App = require('./App.vue');
var VueResource = require('vue-resource');

$(document).ready(function() {
    $('select').material_select();

    var d = new Date();
    d.setFullYear( d.getFullYear() - 100 );
    $('.datepicker').pickadate(
    {
        selectMonths: true,
        selectYears: d,
        max: new Date()
    })
});

Vue.use(VueResource);
Vue.use(VueRouter);

new Vue({
  el: 'body',
  components: {
    app: App
  },
})

var router = new VueRouter();

router.map({
    '/': {
        name: 'addOrganization',
        component: addOrg
    }
})  

router.start(App, '#brightcrest');

我收到的警告

vue.common.js:1019[Vue warn]: v-on:click="createOrganization" expects a function value, got undefined

然后，按钮什么也不做，它不显示任何错误或任何东西。

【问题讨论】：

请把你的答案标记为正确，这样其他人不用来这个页面就知道了。
是的，我一直在尝试 :( 堆栈溢出说我必须等待 2 天，所以我正在等待。谢谢！

标签： javascript vue.js vue-router vue-component

【解决方案1】：

想通了，显然我不必使用新的 Vue 对象，因为当您使用单个文件组件时，vueify 会将其包装起来，因此显然该函数位于父组件中，而不是实际组件中。

这是脚本部分，我唯一改变的是：

<script>
    module.exports = {
        name: 'addOrganization',
        methods: {
            createOrganization: function(event){
                event.preventDefault();
                alert("0");
            }
        }
    };
</script>

【讨论】：