vue.jsの親コンポーネントから子コンポーネントにデータを渡す

Question

親から子コンポーネントにデータを渡そうとしています。しかし、私が渡そうとしているデータは、子コンポーネントでは空白として印刷され続けます。私のコード：Profile.js（親コンポーネント）で

ProfileForm.js（子要素）で

<template> 

    <div class="container"> 
     <profile-form :user ="user"></profile-form> 
    </div> 

</template> 

<script> 

import ProfileForm from './ProfileForm' 

module.exports = { 

    data: function() { 
     return { 
      user: '' 
     } 
    }, 

    methods: { 

    getCurrentUser: function() { 
     var self = this 
     auth.getCurrentUser(function(person) { 
      self.user = person 
     }) 
    }, 

} 

</script> 

<template> 

<div class="container"> 
    <h1>Profile Form Component</h1> 
</div> 

</template> 


<script> 


module.exports = { 


    created: function() { 
    console.log('user data from parent component:') 
    console.log(this.user) //prints out an empty string 
    }, 


} 

</script> 

注 - 私のuser私getCurrentUser()メソッドを介してロードされている...誰かが助けることができますか？

ありがとうございます！小道具を介してデータを渡すには

Answer 1

、あなたはdeclare them in child componentに持っている：

module.exports = { 
    props: ['user'], 

    created: function() { 
    console.log('user data from parent component:') 
    console.log(this.user) //prints out an empty string 
    } 
}