vue组件间函数调用

vue父子组件间函数调用

<Child ref="myChild"></Child>

// 父组件
// 引入子组件
import Child from './Child'
export default {
  // 注册子组件
  components: {Child},
  created () {
    // 调用子组件中的childMethod，并且传递参数data，需要给子组件添加属性ref
    this.$refs.myChild.childMethod(data)
  },
  methods: {
      parentMethod (data) {
          console.log(data)
      }
  }
}

// 子组件
export default {
    methods: {
        childMethod (data) {
            console.log(data)
        },
        parentMethod (data) {
            // 子组件调用父组件函数
            // 在一些UI框架中使用无效，可以使用$emit、vuex等其他方法
            this.$parent.parentMethod(data)
        }
    }
}