Vue 子组件调用实例方法

<div id="app">
  <child v-on:evn="appMethod"></child>
  <child v-on:evn="otherAppMethod"></child>
</div>

<script src="http://cdn.bootcss.com/vue/2.1.10/vue.min.js"></script>
<script type="application/javascript">
    Vue.component('child', {
      template: '<button @click="childMethod">click</button>',
      methods: {
        childMethod: function () {
          // 触发 evn 参数中传入的值(即父组件方法名)
          this.$emit('evn');
          console.log('call child method success!');
        }
      },
    })
    new Vue({
      el: '#app',
      methods: {
        // 定义方法,用于子组件中触发调用
        appMethod: function () {
          console.log('call app method success!');
        },
        otherAppMethod: function () {
          console.log('call other app method success!');
        },
      }
    })
</script>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容