title: How to setup express route res.json(data) object and display the response in vue $HTTP call?
body: <p><a href="https://i.stack.imgur.com/GWhW4.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/GWhW4.png" alt="enter image description here"></a></p>
  
  <p>Actual data in the collection
  <a href="https://i.stack.imgur.com/afMV1.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/afMV1.png" alt="enter image description here"></a></p>
  
  <p>Using express:
  Mongoose model with mongodb collections called "comments"</p>
  
  <pre><code>var mongoose = require('mongoose');
  var Schema = mongoose.Schema;
  var Comment = new Schema({
  title : String,
  });
  mongoose.model('comments', Comment);
  mongoose.connect('mongodb://localhost/test');
  </code></pre>
  
  <p><strong>My get route:</strong></p>
  
  <pre><code>var express = require('express');
  var router = express.Router();
  var mongoose = require('mongoose');
  var Comment = mongoose.model('comments');
  
  
  /* GET form. */
  router.get('/', function (req, res) {
  Comment.find(function (err, comments) {
      res.json(comments);
  });
  });
  </code></pre>
  
  <p><strong>My front.html which using vue and vue resource</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta charset="utf-8"&gt;
  &lt;meta name="viewport" content="width=device-width"&gt;
  
  
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.3/vue.js"&gt;  `   `&lt;/script&gt;`
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/vue-resource/1.0.3/vue-resource.min.js"&gt;&lt;/script&gt; 
  &lt;title&gt;$http access to express route&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;h1&gt;
      &lt;a href="http://localhost:1337"&gt; Front page&lt;/a&gt;
  &lt;/h1&gt;
  
  &lt;div id="app"&gt;
      &lt;ul&gt;
          &lt;li v-for="item in items"&gt;
              {{ item.title }}
          &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
      new Vue({
  
          el: '#app',
  
          data: {
              items: []
          },
  
          created() {
              this.fetchData()
          },
  
          methods: {
              fetchData() {
                  this.$http.get('http://localhost:1337/form')
                    .then(result =&gt; {
                        this.items = result.data
                    })
              }
          }
  
      });
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Comments is not showing in my vue tag. What is the proper way to access the Comment.find(err, comments) object that express send back? The vue resource $http is working when I use a test api like (<a href="https://jsonplaceholder.typicode.com/users" rel="nofollow noreferrer">https://jsonplaceholder.typicode.com/users</a>) but when I try to access my route localhost:1337/form  route, it doesn't show anything. Need someone with good knowledge with express routes, vue. I can't find any examples online that demo this in details. It seems that all tutorials online just skip this part.</p>
  
  <p>Do I need to return the results in my route in a different format? Do I need to add the results to a var so I can access by the $http? Do I need to change my route in express? </p>
  
  <p>If anyone with a live example. It would be great to post a link.</p>