0xD34F

computed: {
  currentTabProps() {
    return {
      is: `tab-${this.currentTab}`,
      text: this.texts[this.components.indexOf(this.currentTab)],
    };
  },
},

<component v-bind="currentTabProps"></component>

18 элементов tbody <...> недопустимо

Допустимо. Спецификация не ограничивает количество элементов tbody.

div внутри tbody

Вместо div можно использовать template.

нужно сделать один циклом

Вычисляемое свойство, внутри flatMap, на выходе - одномерный массив.

Пытаетесь достучаться до свойства несуществующего объекта. А объекта нет потому, что вместо ключа, под которым он доступен как свойство state.products, вы передаёте в addBasket его name. Исправьте вызов addBasket; если же там всё так, как и задумано, замените прямое обращение по имени свойства (state.products[action.payload]) на поиск нужного объекта по его name:

Object.values(state.products).find(n => n.name === action.payload)

const result = [...arr]
  .sort((a, b) => a - b)
  .reduce((acc, n) => (acc[1].push([ acc[0], acc[0] += +n ]), acc), [ 0, [] ])
  .pop();

Значения инпутов я пишу через :value, потому что через v-model он их будет сохранять сразу же.

Не будет. Если сделать копию объекта данных формы, и использовать в v-model свойства копии. А по submit'у обновлять оригинал значениями из отредактированной копии. Например.

const result = arr1.filter(function(n) {
  return this.some(m => m.every(([ k, v ]) => v === n[k]));
}, arr2.map(Object.entries));

Сделать значение параметра to зависящим от текущего маршрута:

computed: {
  catalogRoute() {
    return {
      name: 'catalog',
      params: {
        module: this.$route.name === 'catalog'
          ? this.$route.params.module.replace(/\d+/, m => +m + 1)
          : 'view-1',
      },
    };
  },
},

<router-link :to="catalogRoute">

https://jsfiddle.net/j6uh21cL/

Проверять тип свойства с ценой необходимости нет - пробуем достать новую цену, в случае отсутствия получим undefined, вместо которого с помощью nullish coalescing подставляем просто цену. А чтобы не копипастить извлечение цены, вынесем его в отдельную функцию, которую, как и сам сортируемый массив, можно сделать параметром функции сортировки.

const sorted = (arr, key) => arr
  .map(n => [ n, key(n) ])
  .sort((a, b) => a[1] - b[1])
  .map(n => n[0]);


const sortedArr = sorted(arr, n => -(n.price.new ?? n.price).replace(/\D/g, ''));

Экспорт делаете именованный, а импорт дефолтный - в результате импортируете то, чего нет. Отсюда undefined вместо объекта хранилища.

Меняйте export const store = new Vuex.Store({ на export default new Vuex.Store({. Или import store from './store'; на import { store } from './store';.

Ну и документацию почитать будет нелишним, чтобы не повторять подобных ошибок в будущем.

function updateClasses({ $el, slides, activeIndex }) {
  $el.find('.swiper-slide-prev-prev').removeClass('swiper-slide-prev-prev');
  slides.eq(activeIndex).prev().prev().addClass('swiper-slide-prev-prev');

  $el.find('.swiper-slide-next-next').removeClass('swiper-slide-next-next');
  slides.eq(activeIndex).next().next().addClass('swiper-slide-next-next');
}

on: {
  init() {
    updateClasses(this);
  },
  slideChange() {
    updateClasses(this);
  },
},

vowelsCount = Hash['aeiou'.chars.map{|n| [ n, 0 ]}]
gets.chomp.chars.each{|n| vowelsCount[n] += 1 if vowelsCount.key?(n)}

print(vowelsCount)

То, что вы пытаетесь уникализировать - в js это называется объект, а не массив.
Аналог есть никакой. Давайте сделаем:

const uniqueObj = (obj, key = val => val) =>
  Object.fromEntries(Object
    .entries(obj)
    .filter(function(n) {
      const k = key(n[1], n[0]);
      return !this.has(k) && this.add(k);
    }, new Set)
  );

Очевидно, превращать строку в число явным образом: Int(stringValue). Правда, вам это не сильно поможет - есть ещё косяки. Можете попытаться исправить их самостоятельно.

function([ name, surname, department, position, salary ]) {

При изменении значения селекта надо отправлять новое значение родителю.

Добавьте select'у @input="$emit('input', $event.target.value)", или сделайте вычисляемое свойство:

innerValue: {
  get() {
    return this.value;
  },
  set(val) {
    this.$emit('input', val);
  },
},

<select v-model="innerValue">

const getMaxIndexes = (arr, count) => Object
  .entries(arr.reduce((acc, n, i) => ((acc[n] = acc[n] ?? []).push(i), acc), {}))
  .sort((a, b) => b[0] - a[0])
  .flatMap(n => n[1])
  .slice(0, count);

preg_replace('~ \(.*$~', '', $str)

или

explode(' (', $str)[0]

Добавляете картинку в ползунок:

$slider.find('.ul-slider-handle').html(`<img src="${imageSrc}">`);

При изменении позиции ползунка обновляете интересующее вас css-свойство:

slide(e, ui) {
  $(this).find('.ui-slider-handle img').css('opacity', в зависимости от ui.value);
},

https://jsfiddle.net/4a1xnp0e/1/

Не вижу причин, по которым цвета должны быть классами. Замените на data-атрибуты:

<div data-color="black"></div>
<div data-color="white"></div>

document.addEventListener('click', ({ target: { dataset: { color } } }) => {
  if (color) {
    document.querySelector('button').dataset.id = color;
  }
});

// или

const button = document.querySelector('button');
const onClick = e => button.setAttribute('data-id', e.target.getAttribute('data-color'));
document.querySelectorAll('[data-color]').forEach(n => n.addEventListener('click', onClick));

.container {
  background: #224B7A;
}

.container.active {
  background: #fff;
}

state = {
  active: false,
}

toggleActive = ({ type }) => {
  this.setState(() => ({
    active: type === 'focus',
  }));
}

<div className={`container ${this.state.active ? 'active' : ''}`}>
  ...
  <input onFocus={this.toggleActive} onBlur={this.toggleActive} />