Vue.component('msg-item', { template: `
{{ title }}

{{ subject }}

{{ tag }}

account_circle Erstellt von {{ user }}
`, props: ['title', 'subject', 'tag', 'user'] }) new Vue({ el: '#newmessages-example', data: { messages: [ { id: 1, title: 'Betreff_1', subject: 'Nachricht_1', tag: '#tag_1', user: 'user_1' }, { id: 2, title: 'Betreff_2', subject: 'Nachricht_2', tag: '#tag_2', user: 'user_2' }, { id: 3, title: 'Betreff_3', subject: 'Nachricht_3', tag: '#tag_3', user: 'user_3' } ], }, }) /* First try of vue-componetn -> does not work Vue.component('home', { data: function () { return { } }, template: `
{{elements.subject}}

{{elements.msg}}
{{elements.tags}}

account_circle Erstellt von {{elements.user}}
` }) new Vue({ el: '#sample', data: { private: { messages : [ { message : [ {subject : 'Betreff_1'}, { msg : 'Nachricht_1' }, { tags : '#tag_1' }, { user : 'user_1' } ] }, { message : [ {subject : 'Betreff_2'}, { msg : 'Nachricht_2' }, { tags : '#tag_2' }, { user : 'user_2' } ] }, { message : [ {subject : 'Betreff_3'}, { msg : 'Nachricht_3' }, { tags : '#tag_3' }, { user : 'user_3' } ] } ] } } }) */