0xD34F

Есть таблица
<...>
Может быть, можно упростить

Можно. Вернее, не надо было ничего усложнять - перенесли бы вашу таблицу в код как она была. Двумерный массив. Первый индекс соответствует месяцу (надо только будет вычесть единицу из того, что введёт пользователь), второй возрасту (а здесь, соответственно, вычесть 18). Вся логика со switch'ами ужмётся до одной строчки.

$text = preg_replace_callback("/\{a (\d+)\}/", function($matches) use($routes) {
  return "<a href=\"".$routes[$matches[1]]."\">";
}, $text);

const getCheckedValues = elements =>
  [...elements].reduce((acc, n) => (
    n.checked && (acc[n.name] = acc[n.name] || []).push(n.value),
    acc
  ), {});

Если пустые группы тоже должны присутствовать, то

const getCheckedValues = elements =>
  Array.prototype.reduce.call(
    elements,
    (acc, { name, value, checked }) => (
      acc[name] = acc[name] || [],
      checked && acc[name].push(value),
      acc
    ),
    {}
  );

const numbers = (string.match(/-?\d+(\.\d+)?/g) || []).map(Number);

Всё работает так, как и должно. Чтобы получить требуемое поведение, надо обрабатывать другие события:

@mouseenter="showDrop = true"
@mouseleave="showDrop = false"

UPD. А зачем два свойства для управления отображением форм? Они что, могут показываться одновременно? Может, лучше сделать одно свойство, которое будет содержать имя показываемой формы? Как-то так:

data: () => ({
  showForm: 'auth',
  // ...
}),

Форма авторизации: v-show="showForm === 'auth'", @click="showForm = 'reg'".
Форма регистрации: v-show="showForm === 'reg'", @click="showForm = 'auth'".

[Symbol.iterator]() {
  let curr = this.head;

  return {
    next() {
      if (curr) {
        const item = curr;
        curr = curr.next;
        return {
          done: false,
          value: item,
        };
      } else {
        return {
          done: true,
        };
      }
    },
  };
},

Получается, что объявляем две переменных <...> То есть это равносильно

Не получается, не равносильно. Объявляется одна переменная. Вторая - выполняется лишь присваивание. И если - ВНИМАНИЕ - переменной с таким именем нет в текущей области видимости, будет выполнено присваивание переменной из внешней области видимости. Это, как нетрудно понять, отличный источник потенциальных багов (переменная, которую вроде бы никто не трогал, внезапно своё значение изменила). Ну а если такой переменной ни в одной из внешних областей видимости нет, будет создана глобальная переменная.

Короче, подобный код - безграмотный (а в строгом режиме, при отсутствии второй переменной в какой-либо из доступных областей видимости - и вовсе нерабочий, упадёт с ошибкой).

ховер на .th-search-box не срабатывает, почему?

Потому что никакого ховера у вас там нет, нечему срабатывать.

Я бы предположил, что

.th-icon-box:hover .th-search-box

стоит заменить на

.th-icon-box:hover + .th-search-box,
.th-search-box:hover

Если в одном компоненте произойдет ошибка, будет ли это видно в другом?

Если нет, то подскажите, как...

vuex

Переносите errorOnUpdate в хранилище, а в миксине делаете computed свойство, достающее errorOnUpdate и метод, который будет дёргать мутацию, меняющую значение errorOnUpdate (или просто заменяете присваивание вызовом мутации в методе update, тут вам виднее).

Замените

const Vue = require('vue');

на

const Vue = require('vue').default;

^[a-zA-Z\/-]+\.ph(p|ar)$

Могу предложить пару вариантов.

1. Пусть данные компонента станут свойствами объекта, тогда их можно будет получать по имени свойства. Типа так.

2. Сделайте computed свойство, которое будет представлять текущий набор данных. Типа так.

...

А, ну и конечно ключевое слово this - оно тоже доступно в шаблоне. Так что есть и третий вариант (ну, на самом деле это вариант "полтора" - отличий от первого по сути нет никаких).

UPD. Конечно, все эти три варианта суть одно и то же - получение свойства объекта по имени в переменной. То есть, в конечном счёте, проблема в слабом знании языка. Я бы на вашем месте подтянул основы, а то так и будете сюда бегать с такими вот тривиальными вопросами.

const obj = arr.reduce((max, n) => {
  const val = Object.values(n)[0];
  return val > max[1] ? [ n, val ] : max;
}, [ null, -Infinity ])[0];

@changeMessage="changeMessage"

Да ну? Я вот слышал, будто бы

директивы прослушивания событий v-on внутри DOM-шаблонов автоматически преобразуются в нижний регистр (из-за нечувствительности HTML к регистру), поэтому v-on:myEvent станет v-on:myevent — что делает прослушивание события myEvent невозможным

Просто нужно еще чтобы компонент `SortableElement ` принял все пропсы.

Ну так и передавайте все:

const SortableItem = SortableElement((props) => (
  <ElementItem {...props} />
));

Что не так делаю?

Ну, очевидно же - дёргаете сразу все блоки. А надо только тот, по которому кликнули. Для этого его надо как-то запомнить:

let uploadTo = null;

$('.file-upload-preview').click(function() {
  uploadTo = this;
  $('#file-upload').click();
});

Соответственно, внутри обработчика change заменяете $(".file-upload-preview") на $(uploadTo).

Перезаписывайте значение целиком - то есть, при клике на любой элемент надо обойти и все остальные, которые активны, и получить данные из них:

const inputSelector = '.hidden_field';
const itemSelector = '.item';
const activeClass = 'active';


// как это может выглядеть с использованием jquery
const $items = $(itemSelector).click(function() {
  $(this).toggleClass(activeClass);
  $(inputSelector).val($items
    .filter(`.${activeClass}`)
    .get()
    .map(n => $(n).text())
    .join(', ')
  );
});

// или, к чёрту jquery
const items = [...document.querySelectorAll(itemSelector)];
items.forEach(n => n.addEventListener('click', onClick));

function onClick() {
  this.classList.toggle(activeClass);
  document.querySelector(inputSelector).value = items
    .filter(n => n.classList.contains(activeClass))
    .map(n => n.innerText)
    .join(', ');
}

А как выглядит элемент массива ticket? В смысле - есть ли у него свойство ticket, по которому вы пытаетесь фильтровать? Я бы предположил, что вы просто немного запутались в именах свойств и вместо несуществующего ticket (странно же - массив и свойства его элементов имеют одинаковые имена) должно использоваться какое-то другое свойство... например payeer, которое вы выводите в шаблоне. Или ещё что-то.

контент у всех блоков разный - поэтому в массив их не засунуть

Засунуть. За отличающийся контент пусть отвечает отдельное свойство элементов массива. Если же контент вот прям совсем разный, ничего общего - оформить блоки в виде отдельных компонентов, хранить в элементе массива имя компонента - ну а дальше вместе с v-for использовать :is.