vue组件与组件间传值

vue的组件往往是多层级的，要实现组件与组件间的数据传递也有很多方法。
这里只记录用props实现和用自定义事件实现的方法。
下面代码中student与school组件为姐妹组件，有着共同父组件app。

• 父组件向子组件传递消息用props

父app中的模板，普通传值

  <school name='AppName' number='女' ></school>

子school中接收

data(){
   
        return{
   
         address: "北京",
          msg:'hello'
    }},
 props: ['name','number']//通过this.name使用

• 姐妹组件通过父组件通信。

app中增加回调函数。
将函数传给子组件，

<template>
    <div>
        <school name='AppName' number='女' :receive='receive' ></school>
        <hr>
        <student :schoolmsg='schoolmsg'></student>
        <!-- 普通属性只能传递普通string，:属性名=''后面才能识别表达式 -->
    </div>
</template>

<script>
    import school from "./components/school";