Vue親コンポーネントと子コンポーネントがイベント/呼び出しイベントを渡す

1、Vue親コンポーネントイベント/呼び出しイベントをサブコンポーネントに渡す

<div id="app">
    <hello list="list" ref="child">hello>
    <br />
    <button v-on:click="myclick">         button>
div>
<template id="myT">template>

<script>
    Vue.component('hello', {
        template: '#myT',
        methods: {
            clickme: function () {
                alert("dd");
            }
        }
    });
    var app=new Vue({
        el: '#app',

        methods: {
            myclick: function () {
                this.$refs.child.clickme();
            }
        }
    });
script>

パラメータを渡す場合はpropsデータを使用できます
2.子コンポーネント呼び出し親コンポーネントイベント

<div id="app">
    <hello list="list" v-on:wzhclick="wzhclick">hello>
div>
<template id="myT">
    <button v-on:click="childclick">        button>
template>
<script>
    Vue.component('hello', {
        template: '#myT',
        methods: {
            childclick: function () {
                this.$emit('wzhclick', {a:1,b:2});
            }
        }
    });
    var app=new Vue({
        el: '#app',
        methods: {
            wzhclick: function (data) {
                alert("     ,  "+data.a+";"+data.b);
            },
        }
    });
script>

3.両平等コンポーネント間の呼び出し

@{
    ViewBag.Title = "Index";
}
<link href="~/Content/css/bootstrap-theme.min.css" rel="stylesheet" />
<link href="~/Content/css/bootstrap.min.css" rel="stylesheet" />
<link href="~/Content/css/font-awesome.min.css" rel="stylesheet" />
<script src="~/Content/js/jquery-1.8.2.min.js">script>
<script src="~/Content/js/bootstrap.min.js">script>
<script src="~/Scripts/vue.min.js"> script>
<script src="~/Scripts/axios.min.js">script>
<style>

style>

<div id="app">
    <wzh>wzh>
    <zl>zl>
div>
<script>
    var Event = new Vue();//     
    Vue.component('wzh', {
        template: '
wzh:{{msg}}
',
        data: function () {
            return {
                msg:''
            }
        },
        methods: {
            isay: function () {
                Event.$emit("wzhsay", this.msg);
            }
        }

    });
    Vue.component('zl', {
    template:'
wzh  ：{{wzhmsg}}
',
    data: function () {
        return {
            wzhmsg:'',
        }
    },
    mounted: function () {
        var me = this;
        Event.$on("wzhsay", function (data) {
            me.wzhmsg = data;
        });
    }
    });
    var app=new Vue({
        el: '#app',
    });
script>

新スケジューラはイベントを完了し、mountedでイベントを傍受し、別のコンポーネントでEvent.$を呼び出す.Emitは、このイベントを呼び出してスケジュールを完了します.