Framework 7 Vue - 运行 Parent Vue 的方法不起作用

Framework 7 Vue - Run Parent Vue's Methods not working

我尝试了很多不同的方法 运行 来自父 vue 的一个简单函数,但仍然无法正常工作,console.log 没有错误,但没有任何反应......任何人都请帮我看看关于这个...非常感谢。

app.vue

import childpage from './child.vue';
export default {
    data() {
        return {
            f7params: {
              name: 'myapp',
              id: 'com.myapp.fn',
              theme : 'ios',
              routes: [
                  {
                    path: '/childpage/',
                    component: childpage,
                  },
        }
    },
    events:{
        fn : 'runfn',
    },
    methods: {
        runfn(){
            console.log('HERE!!!');
        }
    },
    components: {
        childpage,
    }
}

child.vue

export default {
    data() {
        return {
            isBottom: true,
        };
    },
    mounted: function(){
        this.runfn();
    },
    methods: {
        runfn(){ 
            this.$emit('fn');
        }
    }
}

尝试如下 =>

this.$parent.runfn();

下面是详细代码

模板

<div id="app">
  <child></child>
</div>

脚本

Vue.component('child', {
  template: '#child-template',
   mounted: function(){
       this.$parent.runfn();
    },
});

var app = new Vue({
    el: '#app',
  methods: {
    runfn(){
        alert('parent');
    }
    }
});

有关详细信息,请参阅此处。 https://jsfiddle.net/RiddhiParekh/onkzr3ms/3/