Связывание мультиселекта с запросом к базе данных в laravel с помощью vue

В настоящее время в Laravel у меня есть работающий экземпляр multiselect Vue, который успешно отображает параметры, которые жестко запрограммированы, но также позволяет мне сохранять ввод в виде тега, если параметр не существует:

new Vue({
    components: {
        Multiselect: window.VueMultiselect.default
    },
    data () {
        return {
            value: [],
            options: [
              { tag: '123', name: 'Test 1'},
              { tag: '456', name: 'Test 2'},


            ]
        }
    },
    methods: {
        addTag (newTag) {
          const tag = {
            name: newTag,
            code: newTag.substring(0, 2) + Math.floor((Math.random() * 10000000))
          }
          this.options.push(tag)
          this.value.push(tag)
        }
    }
}).$mount('#tagContent');

Я пытаюсь связать это с запросом к базе данных в моем контроллере, чтобы получить функцию автозаполнения из результатов базы данных. У меня есть функция, и я протестировал ее с помощью жесткого кодирования $s, но теперь я настроил ее на получение ввода с именем tagSearch, и я очень запутался в том, как связать это, чтобы поиск по моему множественному выбору срабатывал эту функцию правильно. Я новичок в Vue, поэтому любая помощь здесь очень ценится.

public function searchTags()
{   
    $s = "%" . Input::get('tagSearch') . "%";
    $search = Tags::where('TAG_DATA', 'LIKE', $s)->get();

    return json_encode($search);
}

Вы сначала делаете маршрут в Laravel?

nice_dev 21.03.2019 19:32

@vivek_23 да, у меня есть маршрут к контроллеру

Geoff_S 21.03.2019 19:52

Таким образом, вы можете сделать HTTP-запрос из вашего интерфейса vue на этот маршрут и получить подробную информацию в формате JSON.

nice_dev 21.03.2019 19:53

Как мне это сделать через компонент vue? Мне просто нужно выяснить, как отправить множественный выбор в качестве значения INPUT в эту функцию и вернуть их как параметры.

Geoff_S 21.03.2019 19:55

Ну, я не эксперт по Vue, но я бы использовал принести javascript. Вы можете использовать это или можете использовать axios, как указано в этот документ.

nice_dev 21.03.2019 20:01
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
5
35
0

Другие вопросы по теме