2015-07-16 4 views
1

Я делаю простую поисковую систему для своего приложения Laravel 5. Поскольку он только маленький, я просто использую индекс FULLTEXT на моей основной таблице. Я пытаюсь использовать Vue.js, чтобы избежать перезагрузки страницы.Почему мой поиск не работает, когда я использую Vue.js?

В моей SearchController я просто:

public function search(Request $request) 
    { 
     $search = $request->search; 

     $results = Product::whereRaw("MATCH (product_name, product_description) AGAINST (? IN BOOLEAN MODE)", array($search))->get(array('product_name','slug')); 

     return $results; 
    } 

Javascript:

getResults: function(e){ 
     e.preventDefault(); 
     this.$http.get('api/search', function(search){ 
      this.$set('searchResults', search); 
     }); 
} 

и форма:

{!! Form::open(['v-on' => 'submit: getResults($event)', 'method' => 'get', 'action' => '[email protected]']) !!} 
     <div class="form-group"> 
      {!! Form::label('search','Search:') !!} 
      {!! Form::text('search', null, ['class' => 'form-control', 'v-model' => 'search']) !!} 
     </div> 

     <div class="form-group"> 
      {!! Form::submit('Submit', ['class' => 'form-control btn btn-primary']) !!} 
     </div> 

{!! Form::close() !!} 

Если удалить Vue.js из уравнения, форма и я получаю хороший объект результатов поиска JSON. Если я поместил его через Vue.js, я просто получу пустой объект. В обоих случаях я использую один и тот же поисковый запрос.

Что я делаю неправильно?

EDIT: Я зарегистрировал search на пульте в моей функции getResults, и он пуст, что немного объясняет ситуацию. Но почему это пусто? Если я повторяю, поиск данных заполняется, когда я набираю двустороннюю привязку Vue, поэтому search определенно не пуст ...

ответ

0

Это потому, что вы ничего не отправляете с vueJS. Никакие данные не отправляются с запросом ajax. Вам нужно сделать что-то подобное.

this.$http.get('api/search', this.search , function(search){ 
     this.$set('searchResults', search); 
    }); 
+0

Нет кубиков. Должен ли я быть POST вместо запроса? – user4676723

+0

Вы можете попробовать использовать пост, но он должен работать с get тоже. Но я думаю, что это потому, что вам нужно отправить такой объект: {data: this.search}? @ user4676723 – Roadirsh

+0

Или просто попробуйте этот URL: 'api/search? search =' + this.search – Roadirsh