vue笔记-16（组件-父子组件数据和方法传递）

• 父组件向子组件传值
  1. 子组件中，默认无法访问到父组件中的data上的数据和methods中的方法
  2. 父组件可以在引用子组件的时候，通过属性绑定 (v-bind:)的形式，把需要传递给子组件的数据，以属性绑定的形式，传递到子组件内部供子组件使用
  3. 把父组件传递过来的parentmsg属性，先在props数组中，定义一下，这样才能在子组件中使用这个数据
  4. 组件中的所有Props中的数据，都是通过父组件传递给子组件的
  5. 子组件中的data数据，不是通过父组件中传递过来的，而是子组件自身私有的，比如子组件通过Api接口请求回来的数据，都可以放到data身上
  6. 子组件中的data数据是可读可写的，而props中的数据是只读的。（可以修改，但是不推荐修改）

• 父组件把方法传递给子组件
  1. 父组件向子组件传递方法，使用的是事件绑定机制：v-on:或者@。当我们自定义了一个事件属性之后，子组件就能够通过某些方式来调用传递进去的这个方法了
  2. 当点击子组件的按钮的时候，如何拿到父组件传递过来的func方法，并调用这个方法？使用this.$emit('func')。如果有参数，直接拼接在触发方法后，如：this.$emit('func', arg1, arg2...)

• 使用ref获取DOM元素和组件的引用
  1. ref 是英文单词refrence的缩写
  2. 在元素上添加ref属性， 譬如：ref="myh3"
  3. 在VM中使用DOM：this.$refs.myh3.innerText
  4. 同样也可以将ref属性放到component组件元素上，这样就可以直接调用组件的方法和属性

  
  
  
    
    
    
    
  
  
    
  
        
        
  我是一个普通文本