Estoy tratando de usar Vue-multiselect como una búsqueda de autocompletar en una base de datos, pero tengo problemas para recuperar la consulta que estoy enviando desde la llamada axios.

Estoy viendo el valor que estoy escribiendo como 'val' dentro de la función, pero cuando descargo la consulta de la solicitud en el controlador, muestra nulo (mirando la solicitud, el parámetro de consulta parece estar vacío). Estoy pensando que hay un problema con la forma en que lo estoy enviando tal vez.

¿Mi función es incorrecta en cuanto a cómo envío la consulta?

Aquí está el código:

 <div class="form-group col-lg-4"> <h4>Copy Users</h4> <br> <multiselect v-model="copyUsers" :options="copyUsersOptions" @search-change="val => searchCopiedUsers(val)" :multiple="true" :loading="loading" placeholder="Enter user(s) to be copied" label="name" track-by="value"> </multiselect> </div> loading:false, copyUsers: [], copyUsersOptions: [], searchCopiedUsers: function(val) { console.log('searched for', val); if (val) { this.loading = true; this.copyUsersOptions = []; let self = this; axios.get('users/search',{params: {query: this.val}}) .then(function (response) { self.options = response.data; }); } else { this.options = []; } },

controlador.php

 public function getUsers(Request $request) { dd($request->get('query')); }