vue 实例如何给一个单文件组件传值

Question

如题, 先看代码：

我的入口文件 index.js 代码如下:

import app from './component/app.vue'

let v = new Vue({

      el: '#app',

      data() {

        return {

            test: '',

        };

    },

      template: '<app/>',

    components: {

        app

    }

    

});

Vue.prototype.test = function (str) {

    v.$set(v, 'test', str);

}

app.vue 文件代码如下：

<template>

    <div class="wrap">

        <div>{{test}}</div>

    </div>

</template>

<script type="text/javascript">

export default {

    name: 'app',

    data() {

        return {

            test: {},

        }

    },

};

</script>

我在入口文件里 定义了一个 全局方法 test, 想在(无论哪个)子组件里 直接 通过 this.test('this is test') 都能给 app.vue 里传一个 test 值进来，然后更改 app.vue 里test值，不知道有什么办法能做到这个，或者有其他办法能实现我的功能

Answer 1

用$emit发送，$on接收，具体参见链接可以在App.vue里import Vue from 'vue'Event=new Vue()//然后在组件里通过Event.$emit发送，Event.$on接收或者新建一个event.jsimport Vue from 'vue'export var Event = new Vue()在要传递的组件里import { event } from 'event.js'Event.$emit......