vue axios wp rest api

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="style.css">
    <script src="//cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="//unpkg.com/axios/dist/axios.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
  </head>
  <body>
    <h1>Hello Plunker!</h1>
    <div class="cnotv__container" id="app">
	    <section class="cnotv__navbar has-search-open"> 
		    <div class="cnotv__navbar__search">
			    <input type="text" class="search-field" placeholder="Type here to search a topic... (e.g. CSS, html)" v-model="question" v-on:keyup.esc="cancel" />
			    <a href="#" v-if="question" v-on:click="cancel"><i class="fa fa-times"></i></a>
		    </div>
	    </section>
	    <section class="cnotv__section">
		    <div v-html="answer" class="h6"></div>
	    </section>
	    <section class="cnotv__section post">	
		    <div class="cnotv__flexgrid">
			    <article class="cnotv__flexgrid__column cnotv__flexgrid__column--2" v-for="results in result">
				    <img v-if="results.featured_image" :src="url+ 'media/' +results.featured_image">
				    <h4>
					  <a v-if="results.link" v-bind:href="results.link" target="_blank">
					  {{ results.title.rendered }}
					  </a>
				    </h4>
				    <div v-html="results.excerpt.rendered"></div>
				    <!-- <pre v-html="results"></pre> -->
			     </article>
		    </div>
	    </section>
    </div>
		<script src="script.js"></script>
  </body>
</html>



new Vue({
  el: '#app',
  data: {
    question: '',
    answer: '',
    result: '',
    url: '//cnotv.xyz/wp-json/wp/v2/',
  },
  watch: {
    question: function(newQuestion) {
      this.answer = '<i class="fa fa-pencil"></i> Waiting...'
      this.getResult()
    }
  },
  methods: {
    getResult: _.debounce(function() {
      if (this.question) 
      {
        this.answer = '<i class="fa fa-search"></i> Searching...'
        var vm = this
				var searchUrl = this.url + 'posts?&search=' + this.question
        axios.get(searchUrl).then(function(response) {
          vm.result = response.data
					vm.answer = 'Results for: ' + vm.question + ' (' + response.data.length + ')'
        }).catch(function(error) {
          vm.answer = error
        })
      }
      else
      {
        this.answer = ''
      }
    }, 500),
    cancel: function()  {
      this.question = ''
    }
  }
})



.cnotv__container {
	min-height: 100vh;
	margin-top: 1em;
}

.cnotv__navbar {
	margin-bottom: 1em;
}