<template> <div class="hello"> <div class="heading"> </div> <div class="row"> <div class="input-field col s6"> <div class="row"> <div class="input-field col s6 offset-s9"> <input v-model="blogs.Title" id="first_name" type="text" class="validate" placeholder="Title"> <input v-model="blogs.Name" id="first_name" type="text" class="validate" placeholder="Name"> </div> <div class="input-field col offset-s6 s12"> <textarea v-model="blogs.content" id="textarea1" type="text" class="materialize-textarea s12" placeholder="Content of the blog" /> <a class="btn" @click.prevent="post">button</a> </div> </div> </div> </div> <div class="blog"> <h1>{{blogs.Title}} </h1> <h5 v-if="!blogs.Name =='' ">by</h5> <h2 >{{blogs.Name}}</h2> <h4 > {{blogs.content}}</h4> </div> <div class="blogposts"> <h1>Other posts and stories</h1> <ul> <li></li> </ul> </div> </div> </template> <script> export default { name: 'Main', data(){ return{ blogs:{ Name:'', Title:'', content:'' }, blog:[{ }], realBlogs:[{ }] } }, methods:{ post: function () { this.blog.push(this.blogs) this.$http.post('firebase',this.blog).then(function(data){ console.log(data.json()); }, this.blog = [{}] ); } }, created(){ this.$http.get('https://wbhspost-default-rtdb.firebaseio.com/posts.json').then(function(data){ return data.json(); }).then(function(data){ var blogsArray = []; for (let key in data){ data[key].id = key blogsArray.push(data[key]); } this.realBlogs = blogsArray; }) } } </script>Es como un blog. simplemente no funciona Este es todo mi código. Todo funciona bien además de recuperar datos. Estoy usando firebase para la base de datos y es bueno, simplemente no tengo idea de cómo recuperar la información que se almacena allí después de que el usuario la envía. También estoy usando vue js 2 si eso le importa a alguien.