` }) var news=Vue.component("news",{ props:["news"], template:`

user: {{news.user}} like: {{news.like}} repost: {{news.reposts}} views: {{news.views}}

Comments: {{news.comments.length}}

Like: {{c.like}}

` ,data:function(){ return {text:"Add comment"} }, methods:{ addcom(id){ console.log(id) this.$store.dispatch('addcom',{text:this.text,id:id}); } }}) var User=Vue.component("user",{ props:["user"], template:"

name	{{user.name}}
login	{{user.login}}
date	{{user.date}}
proffesion	{{user.prof}}
country	{{user.country}}
city	{{user.city}}
gender	{{user.gender}}
site	{{user.site}}

" }); var Useredit=Vue.component("useredit",{ props:["user"], template:"

name
login
date
proffesion
country
city
gender
site

", }); var friends=Vue.component("friends",{ template:"

{{user.name}}
name	{{user.name}}
login	{{user.login}}
date	{{user.date}}
proffesion	{{user.prof}}
country	{{user.country}}
city	{{user.city}}
gender	{{user.gender}}
site	{{user.site}}

Add random friend

", methods:{ addfriends:function(){ this.$store.dispatch('addfriends',Math.floor(Math.random()*5)); } } }); let UserPage=Vue.component("userpage",{ template:"

" , data:function(){ return {show:true} }, methods:{ toggle(){ this.show=!this.show; } } }) let Chats=Vue.component('chats',{ template: `

{{c.login}}	{{c.msg}}	{{c.date}}	{{c.time}}

` }) var AddNews=Vue.component('addnews',{ template:`

Title:

Text:

`, data:function(){ return { text:'Add this text for news feed', title:'Add news' } }, methods:{ addnews(){ this.$store.dispatch('addnews',{ text:this.text, title:this.title }); } } }); var Home = Vue.component('home',{ template: "

News

Last news

" }); var About = { template: "

About

This is some information about our awesome company.

" }; var Msg = Vue.component('msg',{ template:`

Messages
{{msg.title}}
from: {{msg.from}} to: {{msg.to}} title:{{msg.title}} date:{{msg.date}} time:{{msg.time}} {{msg.text}}

`}); var courses = Vue.component('course',{ template:`

Courses
{{c.name}}
{{c.category}}
Time learn:{{c.time}} ({{c.process}}/{{c.lessions}})
Students:{{c.students}}
Price:{{c.price}}$
Start:{{c.start}}

`}); var routes = [ { path: '/', component: Home }, { path: '/user',component: UserPage}, { path: '/msg',component:Msg}, { path: '/chats',component:Chats}, { path: '/courses',component: courses}, { path: '/friends',component: friends}, { path: '/about', component: About} ]; var router = new VueRouter({ routes: routes, }); window.onload=function(){ var app = new Vue({ store, el: '#app', router: router, });}

{{news[i].title}}

{{news.title}}

{{user.name}}

Add random friend

News

About

Messages

Courses

{{c.name}}

bootstrap news page