From 4cf54df7e7a27e1dde51860043b019392bb293c9 Mon Sep 17 00:00:00 2001 From: Edwina Barbalan Date: Wed, 5 Dec 2018 16:35:54 +0100 Subject: [PATCH] =?UTF-8?q?funktionierender=20Router=20hinzugef=C3=BCgt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/home.js | 113 ++++++++++++++++++++-------------------------- public/index.html | 58 ++++++++++-------------- 2 files changed, 72 insertions(+), 99 deletions(-) diff --git a/public/home.js b/public/home.js index 319ed35..d3b9b5b 100644 --- a/public/home.js +++ b/public/home.js @@ -1,72 +1,55 @@ -Vue.component('Home', { - template: `
-
+_messages = [ + { + id: 1, + subject: 'Betreff', + message: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam.', + tag: '#efi #bme #semester', + user: 'user_1' + }, + { + id: 2, + subject: 'Betreff', + message: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.', + tag: '#efi #fachschaft', + user: 'user_2' + }, + { + id: 3, + subject: 'Betreff', + message: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam.', + tag: '#efi #bei #wichtig', + user: 'user_3' + }, +]; + + +Vue.component('MsgCard', { + template: `
- {{ subject }} + {{ msg.subject }}
- {{ message }}

- {{ tag }}

+ {{ msg.message }}

+ {{ msg.tag }}

account_circle - Erstellt von {{ user }} -
`, - props: ['subject', 'message', 'tag', 'user'] -}) + Erstellt von {{ msg.user }} +
`, + props: ['msg'] +}); -new Vue({ - el: '#message-list', - data: { - messages: [ - { - id: 1, - subject: 'Betreff', - message: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam.', - tag: '#efi #bme #semester', - user: 'user_1' - }, - { - id: 2, - subject: 'Betreff', - message: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.', - tag: '#efi #fachschaft', - user: 'user_2' - }, - { - id: 3, - subject: 'Betreff', - message: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam.', - tag: '#efi #bei #wichtig', - user: 'user_3' - } - ], +const HomeRouter = { + template: ` +
+ +
`, + data: function () { + return { messages: _messages }; }, -}) - - -/* 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}} -
-
-
-
` -}) - -*/ + methods: { + }, +}; diff --git a/public/index.html b/public/index.html index a5841c5..53669a7 100644 --- a/public/index.html +++ b/public/index.html @@ -17,12 +17,18 @@ + - + + + + + + OMApp @@ -42,36 +48,26 @@
-
- +
-
- - - - + - - - - - - - + - +