Create search controls with auto suggest using vue instant


This Vue component allows you to implement search with suggestions as the user types. Bellow is an example which is using the MovieDB API and display search results from it.



npm install --save vue-instant


  <div id="app">
    <vue-instant id="styles" @input="changed" v-model="value" :suggestion-attribute="suggestionAttribute":suggestions="suggestions"></vue-instant>

import axios from 'axios'
export default {
  name: 'app',
  data () {
    return {
      value: '',
      suggestionAttribute: 'original_title',
      suggestions: []
  methods: {
    changed: function () {
      var that = this
      this.suggestions = []
      axios.get('' + this.value)
        .then(function (response) {
 (a) {

Calls to API are done via Axios.

You can see more options for for attributes, events, and customization of the search box, at documentation.

The source code is available on GiHub along with this example. By Santiago Blanco.