2016-05-25 11 views
1

Ich habe ein Vuejs-Skript und muss eine Elasticsearch API-Methode verwenden.Vuejs mit Elasticsearch API-Methoden

// ./main.js 
var Vue = require('vue'); 

Vue.use(require('vue-resource')); 

import ES from './elasticsearch.js'; 

new Vue({ 

    el: 'body', 

    methods: { 
     search: function() { 
      // should call the es.search... 
     } 
    } 
}); 

und das Elasticsearch Skript:

// ./elasticsearch.js 
var es = require('elasticsearch'); 

var client = new es.Client({ 
    host: 'localhost:9200' 
    ,log: 'trace' 
}); 

client.search({ 
    index: 'my_index', 
    type: 'my_type', 
    body: { 
    fields: {}, 
    query: { 
     match: { 
     file_content: 'search_text' 
     } 
    } 
    } 
}).then(function (resp) { 
    var hits = resp.hits.hits; 
}, function (err) { 
    console.trace(err.message); 
}); 

So wird bei dem Verfahren Suche in main.js die client.search und senden Sie den Text zu such nennen sollte in meiner Server (_search_text_).

Wie binden wir es? Oder wie verwenden wir das elasticsearch Objekt innerhalb einer vuejs Methode?

Danke!

Antwort

4

Ihre Datei elasticsearch.js ist nicht korrekt als Modul konfiguriert: import ES from './elasticsearch' wird nichts tun, weil die Datei nichts exportiert.

sollte es wohl eher so aussehen:

// ./elasticsearch.js 
var es = require('elasticsearch'); 

var client = new es.Client({ 
    host: 'localhost:9200' 
    ,log: 'trace' 
}); 

function search (myIndex, myType, searchText) 
    return client.search({ 
    index: myIndex, 
    type: myType, 
    body: { 
     fields: {}, 
     query: { 
     match: { 
      file_content: searchText 
     } 
     } 
    } 
    }).then(function (resp) { 
     return hits = resp.hits.hits; 
    }, function (err) { 
    console.trace(err.message); 
}); 

export { search } 

Wir definieren eine Funktion search benannt und exportieren. Beachten Sie, dass ich auch return Anweisungen eingeschlossen habe, um das Versprechen und das Ergebnis von der Funktion zurückzugeben.

Dann in main.js wir können sie importieren mit diesem Namen, und verwenden Sie es:

// ./main.js 
var Vue = require('vue'); 

Vue.use(require('vue-resource')); 

import { search } from './elasticsearch.js'; 

new Vue({ 

    el: 'body', 

    methods: { 
     search: function() { 
      var result = search('someindex', 'sometype', 'Search text here').then(function(res) { 
    // do something with the result 
    }) 
     } 
    } 
}); 
+0

Dank Linus werde ich das zu Hause versuchen und später antworten! Freundliche Grüße. – Evis

+0

Perfekt! Vielen Dank!!! Schöne und vollständige Antwort. – Evis

0

Ich nehme an "resp.hits.hits" in Ihrem Code ist das Suchergebnis JSON-Objekt Array, dann können Sie Ihre vue Beispiel wie unten definiert:

// ./main.js 
var Vue = require('vue'); 

Vue.use(require('vue-resource')); 

import ES from './elasticsearch.js'; 

new Vue({ 

    el: 'body', 
    data:{ 
     searchResults:[] //this tell vue it is an array 
    } 

    methods: { 
     search: function() { 
      var self = this; 
      // call the search and get response data 
      client.search(function(resp){ 
       self.searchResults = resp.hits.hits 
      }) 
     } 
    } 

});

und in Ihrem HTML, binden Sie nur DOM an searchResults, das ist alles.

+0

Danke für die Antwort, aber das ist was ich zu tun versuchen, erhalten die Client-Referenz innerhalb des vue Skript . Wenn _client.search_ verwendet wird, bringt es: __main.js: 71082 Uncaught ReferenceError: Client ist nicht definiert__. Ich muss alle Funktionen _client.search ...._ in eine Methode in vuejs bringen. Vielen Dank! – Evis