VueインスタンスからVueコンポーネントにデータを渡す

Question

VueインスタンスからVueコンポーネントにデータを渡すにはどうすればよいですか？私はここでfiddle

HTML

<div id="app"> 
    <my-notification></my-notification> 
</div> 

<template id="my-template"> 
    <ul> 
     <li v-for="nn in notifications">{{ nn }}</li> 
    </ul> 
</template> 

のVueスクリプト

Vue.component('my-notification',{ 
    template : '#my-template', 
}); 

new Vue({ 
    el : '#app', 
    data : { 
     notifications : ['notification 1','notification 2','notification 3'] 
    } 
}); 

が持っているもの残念ながらですが、私のコンポーネントテンプレート内に存在する '李' に 'V-のための' を実行しようとしています私はこれまでに試してみました（私のフィドルを参照してください）は動作していない、任意の助けてください？ [vue.js内のコンポーネントにデータを渡す]の

Answer 1

が、私は自分のコード更新

<div id="app"> 
    <my-notification :notification="notifications"></my-notification> 
</div> 

<template id="my-template"> 
    <ul> 
     <li v-for="nn in nns">{{ nn }}</li> 
    </ul> 
</template> 

Vue.component('my-notification',{ 
    template : '#my-template', 
    props : ['notification'], 
    data : function(){ 
     return { 
      nns : this.notification 
     } 
    } 
}); 

new Vue({ 
    el : '#app', 
    data : { 
     notifications : ['notification 1','notification 2','notification 3'] 
    } 
});