本文共 660 字，大约阅读时间需要 2 分钟。

父组件向子组件传值

1. 组件实例定义方式，注意：一定要使用props属性来定义父组件传递过来的数据

2. 使用v-bind或简化指令，将数据传递到子组件中：

子组件向父组件传值

1. 原理：父组件将方法的引用，传递到子组件内部，子组件在内部调用父组件传递过来的方法，同时把要发送给父组件的数据，在调用方法的时候当作参数传递进去；
2. 父组件将方法的引用传递给子组件，其中，getMsg是父组件中methods中定义的方法名称，func是子组件调用传递过来方法时候的方法名称

3. 子组件内部通过this.$emit('方法名', 要传递的数据)方式，来调用父组件中的方法，同时把数据传递给父组件使用

组件中data和props的区别

注意在子组件中设置data时的数据格式

组件中的所有的props中的数据，都是通过父组件传递给子组件的 props中的数据都是只读的，无法重新赋值，把父组件传递过来的数据属性，先在props数组中定义一下，这样才能使用这个数据 子组件中的data数据，并不是通过父组件传递过来的，而是组件自身私有的，比如，子组件通过ajax请求回来的数据都可以放到data上，data中的数据都是可读可写的

评论列表案例

目标：主要练习父子组件之间传值

使用 this.$refs 来获取元素和组件

   
    
    
      
           
           
     
这是一个大大的H1
      
     
      
           
         
    
  
   
  

转载地址：http://foxui.baihongyu.com/