samedi 14 juillet 2018

vue js how to instant search result empty

please see my code that I'am not sure what I'm doing wrong? when the search input is empty then it shows all data from db how to fix, vue lenght doesnt work??

  var app = new Vue({
    el: '#newsearch',
    data: {
      qry: '',
      bUrl: 'http://localhost:8000',
      results: [],
    },
    methods: {
      autoComplete(){
        this.results=[];
        axios.post(this.bUrl + '/search', {
          qry: this.qry
        })
      .then ( (response) => {
        app.results = response.data;
      })
      }
    }
  });

html

<p class="control is-expanded has-icons-right">
    <input class="input" v-model="qry" v-on:Keyup="autoComplete" type="text" placeholder=">.<"/>
  </p>
  <p class="control">
    <a class="button is-dark">
      <i class="fa fa-search"></i>
    </a>
  </p>
  <div v-show="results.length">
    <p v-for="result in results">
      @
    </p>
  </div>
</div>



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire