vue子组件怎么调用父组件的方法

现有一个子组件,我希望在我关闭子组件时,它能顺便去刷新一个表格的信息,但这个刷新的方法在父组件里面,这样应该怎么去调父组件的方法。

阅读 51.8k
评论
    4 个回答
    1. $emit向父组件触发一个事件,父组件监听这个事件就行了。

    2. 直接用this.$parent.xxxx这样直接调用父组件的方法。

      Parent.vue

      
      <template id="">
          <child @refreshList="onRefresList"></child>
      </template>
      
      <script>
          export default {
              data () {
                  return {
                      
                  };
              },
              components: {
                  Child
              },
              mounted() {},
              methods: {
                  onRefresList () {
                      
                  }
              },
              computed: {},
              watch: {}
          };
      </script>
      
      
      

      Child.vue

      this.$emit('refreshList');

      涉及到组件之间的通信的问题。组件之间的通信可以分为以下几种:

      1. 父子组件传递,父向子传递采用props,子向父采用事件emit

      2. 非父子组件的传递,全局Event bus,new一个vue的实例,采用事件的方式通信,再者采用vuex全局状态管理

        this.$emit()
        看下文档,
        也可以像数据哪有传过去再调用,原理差不多

          • 676

          关闭方法里面加个

          this.$emit('on-hide')
            撰写回答

            登录后参与交流、获取后续更新提醒