在Vue的父子组件之间传递数据及调用方法

一、传递数据

有时 在子组件中需要用到父组件的数据
然鹅 在默认情况下 子组件中是无法访问到父组件中的data数据和methods中的方法的

父组件可在在引用的时候通过属性绑定(v-bind)的方式将将需要传递给子组件的数据传递给子组件
然后 在子组件中通过props属性进行定义即可

<script>
    var vm=new Vue({
    
       el:'#app',
       data:{
    
           mymsg:"123"
       },
       methods:{
    },
       components:{
    
           childcom:{
    
               template:"<h1>{
    {parentmsg}}</h1>",
               // 组件中的所有props中的数据都是通过父组件传递给子组件的
               // 将父组件传递过来的parentmsg属性在props数组中进行定义 如此 才可使用该数据
               props:["parentmsg"]
           }
       }
    });
</script>

在子组件标签上 用v-bind进行绑定：