组件数据传递

我们之前讲解过了组件之间的数据传递，props 和 自定义事件 两种方式

1. props : 父传子
2. 自定义事件 : 子传父

出了上述的方案，props也可以实现子传父

xxxxxxxxxx
<template>
  <Child :onFnEvent="fn" />
  <p>{{ message }}</p>
</template>
<script>
import Child from "./components/Child.vue"
export default {
  data() {
    return {
      message:""
    }
  },
  methods: {
    fn(data) {
      this.message = data
    }
  },
  components: {
    Child
  }
}
</script>

xxxxxxxxxx
<template>
    <h3>组件传递数据</h3>
    <p>{{ onFnEvent('测试数据') }}</p>
</template>
<script>

export default {
    props:{
        onFnEvent:{
            type:Function
        }
    }
}
</script>