Igor Koch

<div v-bind:style="{backround: `url('${getPhoto()}')`}"></div>

Работа с классами и стилями

https://github.com/axios/axios CTRL + F "get"

// Make a request for a user with a given ID
axios.get('/user?ID=12345')
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

axios.get('/user', {
    params: {
      ID: 12345
    }
  })

Дублируйте просто класс в передаваемую функцию:

<h1 class="title" v-bind:class="{ 'active': isVisible('title')}">Test</h1>

Просто используйте также стрелочную функцию в timeout, тогда this будет виден.

this.timeout = window.setTimeout(() => {
  //function body
});

либо

let self = this; //за пределами блока

//...

self.telbook = response.data //внутри блока

https://jsfiddle.net/rzkrndyg/2/

:style="{'background-image': 'url(' + require('./images/bg/1.jpg') + ')' }"

:style="{'background-image': 'url(' + require('~/assets/img/logo.png') + ')' }"

https://ru.vuejs.org/v2/guide/transitions.html

Enjoy:

getTown(e) {
  let self = this;
  $("#search_select").keyup(function() {
    if ($(this).val().length > 2) {
      queryParams['str'] = $(this).val();
      callApi('towns', queryParams, '').then((res) => {
        Vue.set(self, 'cities', res.data.data);
        console.log(2, $('#li').length, self.cities);
      })
    }
  })
},

P.s. Отучайтесь пихать Jquery туда где он не нужен, ваш код прямо таки хочется взять и ... переписать)
Есть куча уже готовых компонентов под ваши задачи: https://github.com/vuejs/awesome-vue#autocomplete

У вас получается:

<div id="vue-app">
  <!--Blade-->
  <style>.some{}</style>
</div>

У вас получается что в теле тэга vue затесался тэг стиль, ищите блэйд компонент в котором все так написано и переносите тэг стиль в другое место.

Я делал секцию в layout.app за пределами элемента vue, и код js + css переносил туда.

@extends('layouts.body')

@section('body_content')
  <div id="app">

  @include('menus.top')

  @yield('content')

  @include('menus.bottom')

  </div><!-- #app -->

  <!-- Scripts -->
  <script src="{{ asset('js/app.js') }}"></script>

  @yield('page_script')
@endsection

SQL, XSS Инъекции на фронтенде не избежать.
Делайте валидацию на сервере.

Но если хотите предупредить пользователя что сервер ответ не примет:
https://github.com/vuejs/awesome-vue#validation

Можно вот так:
https://forum.vuejs.org/t/passing-data-back-to-par...

На поле в чайлде повесить @change="runMethod(variable_from_vuex)"

Эвент в чайлде эммитит в парент, а парент передает значение переменной в свою data

Потому что нужно использовать v-bind в атрибутах.
:href="routeHome"

В data храните номер активного таба, а в эвентах используйте его:

Эвент:
@mouseleave="expand(1)"

В табах:
:class="{ active: active == 1 }"

data:

data() {
    return {
      acitve: 1,
    };
 },

а в методах:

methods: {
    expand(number) {
      Vue.set(this, 'active', number); //this.active = number
    },
  },

v-bind
:placeholder="warning"

Посмотрите этот проект, а в частности как
сервер обращается с api и вместо связки nuxt + express, на примере делайте nuxt + php