vue父子组件传值之间的个人肤浅的理解

父组件

父组件-----子组件传值的话就是需要在父组件绑定一个自定义的属性值或属性名 子组件内部通过props接收

<template>
  <div class="hello">
    父组件：这是子组件传给我的值{{num}}
    <Child :username='name' @getNum='getmsg'></Child>
  </div>
</template>

<script>
import Child from './Child'
export default {
  name: 'Father',
  components:{
    Child
  },
  data () {
    return{
      name:"zhangsan",
      num:''
    }
  },
  methods:{
    getmsg(num){
      this.num=num;
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>

           

子组件 -----父组件传值的就是通过绑定自定义的事件在事件内部通过$emit推送给父组件

<template>
<div class="child">
    子组件-------父组件传过来的值{{username}}
    <button @click="senmsg">向父组件传递的数值</button>
 </div>   
</template>
<script>
export default {
    name:'Child',
    props:['username'],
    data(){
        return{
            num:0
        }
    },
    methods:{
        senmsg(){
            this.$emit('getNum',this.num++);
        }
    },
    mounted(){

    }
}
</script>
<style>
     .child{
         margin-top:5%;
     }
</style>



           

小白第二次写博客 轻喷 只是个人的随笔 有哪些理解不对的地方 多多指教 共同进步