0xD34F

(\d+)\s*$

Родитель всегда общий? Если да, тогда добавьте в него свойство, которое будет указывать, в каком из экземпляров вашего компонента надо отображать дополнительные элементы. В качестве значения можно использовать индекс экземпляра, например (не обязательно, также подойдёт какое-нибудь свойство из объектов с данными, на основе которых создаются экземпляры компонента - главное, чтобы значения были уникальными, типа id):

data: () => ({
  items: [ ... ],
  active: null,
}),

<v-xxx
  v-for="(n, i) in items"
  :показыватьДополнительныйКонтент="active === i"
  @переключитьОтображениеДополнительногоКонтента="active = active === i ? null : i"
  ...

https://jsfiddle.net/kdg4qevp/

В противном случае создайте наблюдаемый объект, и поместите свойство, указывающее кого отображать, в него:

const xxx = Vue.observable({ active: null });

В свой компонент добавьте вычисляемое свойство, значение которого а) определяет необходимость демонстрации дополнительных элементов; б) зависит от свойства наблюдаемого объекта:

computed: {
  показыватьДополнительныйКонтент() {
    return xxx.active === this.какоеТоСвойствоСУникальнымЗначением;
  },
},

<div v-if="показыватьДополнительныйКонтент">
  ...
</div>

Также добавьте в свой компонент метод для переключения отображения дополнительного содержимого:

methods: {
  переключитьОтображениеДополнительногоКонтента() {
    xxx.active = this.показыватьДополнительныйКонтент
      ? null
      : this.какоеТоСвойствоСУникальнымЗначением;
  },
},

<button @click="переключитьОтображениеДополнительногоКонтента">
  {{ показыватьДополнительныйКонтент ? 'hide' : 'show' }}
</button>

https://jsfiddle.net/kdg4qevp/1/

newArr = list({ n[1]: n for n in array[::-1] }.values())

или, с сохранением исходного порядка:

newArr = [ n for n in array if n == next(m for m in array if m[1] == n[1]) ]

Вставить - никак. Строки в js изменять нельзя. Можно сделать новую:

const insert = (str, index, substr) =>
  str.replace(RegExp(`(?<=.{${index}})`), substr);

// или

const insert = (str, index, substr) =>
  str.replace(RegExp(`.{${index}}`), `$&${substr}`);

// или

const insert = (str, index, substr) =>
  str.length >= index ? str.slice(0, index) + substr + str.slice(index) : str;

Куда надо выводить номера слайдов:

const counterSelector = 'селектор элементов внутри слайдов, где должны отображаться их номера';

Выводим:

document.querySelectorAll(counterSelector).forEach((n, i, a) => {
  n.textContent = `${i + 1} / ${a.length}`;
});

Это если делать до инициализации слайдера (const swiper = new Swiper(...);), или среди его настроек отсутствует loop: true. В противном случае для вычисления количества слайдов придётся отбросить дубликаты, а индексы надо будет доставать из data-атрибута (UPD. Неактуально, начиная с девятой версии - дублирования слайдов больше нет):

const slidesCount = swiper
  .slides
  .filter(n => !n.matches('.swiper-slide-duplicate'))
  .length;

swiper.slides.forEach(n => n
  .querySelector(counterSelector)
  .innerText = `${-~n.dataset.swiperSlideIndex} / ${slidesCount}`
);

Радиокнопкам добавить data-атрибут, который будет содержать значение для плейсхолдера:

<input type="radio" name="method" data-placeholder="hello, world!!">
<input type="radio" name="method" data-placeholder="fuck the world">
<input type="radio" name="method" data-placeholder="fuck everything">

Как передать это значение из радиокнопки в инпут:

const updatePlaceholder = (input, radio) =>
  input.placeholder = radio.dataset.placeholder;
  // или
  // input.setAttribute('placeholder', radio.getAttribute('data-placeholder'));
  // input.attributes.placeholder.value = radio.attributes['data-placeholder'].value;

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

Обработчик события change можно сделать делегированным:

document.addEventListener('change', ({ target: t }) => {
  if (t.matches('input[name="method"]')) {
    updatePlaceholder(t.closest('form').querySelector('[name="wallet"]'), t);
  }
});

Или назначать каждой радиокнопке индивидуально:

const onChange = ({ target: t }) =>
  updatePlaceholder(t.form.elements.wallet, t);

for (const form of document.forms) {
  for (const radio of form.elements.method) {
    radio.addEventListener('change', onChange);
  }
}

$.param($(this).serializeArray().filter(n => +n.value && n.name !== 'mode'))

Это означает, что вы не знаете js.

Да и в целом - плохо понимаете смысл используемых вами слов. Какой шаблон, вы чего? Шаблон vue - это html, который компилируется в render-функцию. А вы что показали?

Кого кликаем, кого показываем, какой класс отвечает за показ, через какой атрибут задаётся связь кнопок и блоков:

const buttonOpenSelector = '.project__zoom';
const buttonCloseSelector = '.overlay--close';
const contentSelector = '.overlay--gallery';
const key = 'gallery';
const attr = `data-${key}`;
const activeClass = 'overlay--active';

Вот jquery:

$(document)
  .on('click', buttonOpenSelector, function() {
    $(`${contentSelector}[${attr}="${$(this).data(key)}"]`).addClass(activeClass);
  })
  .on('click', buttonCloseSelector, function(){
    $(this).closest(contentSelector).removeClass(activeClass);
  });

А вот jquery нет:

document.addEventListener('click', ({ target: t }) => {
  t
    .closest(buttonCloseSelector)
    ?.closest(contentSelector)
    .classList
    .remove(activeClass);

  (t = t.closest(buttonOpenSelector)) && document
    .querySelector(`${contentSelector}[${attr}="${t.dataset[key]}"]`)
    .classList
    .add(activeClass);
});

str.replace(/(\+\d)(\d{3})\d{5}/, '$1 ($2) ***-**-')

function plainArray($arr, $keys = []) {
  $result = [];

  foreach ($arr as $k => $v) {
    $keys[] = $k;

    $result += is_array($v)
      ? plainArray($v, $keys)
      : [ implode('__', $keys) => $v ];

    array_pop($keys);
  }

  return $result;
}

arr = string.split('|')
arr[1], arr[2] = arr[2], arr[1]
newString = '|'.join(arr)

или

import re

newString = re.sub(r'(\|\d+)(\|\d+)', r'\2\1', string, 1)

Всё так, всё работает. Между "не работает" и "работает не так, как я задумал" есть существенная разница, попытайтесь её осознать.

Во-первых, чтобы результирующий массив был непустым, надо, как минимум, из коллбека фильтрации что-то возвращать. При использовании map'а - тоже. Кстати, а зачем map? Непонятно. Возможно, вместо него нужен some.

Во-вторых - в dataset лежат строки, сравниваете их вы с числами. Без приведения типов. Очевидно, что результаты подобных проверок всегда будут ложными.

/(?=.*\d\d)^\D.{5,}$/

return {
  ...state,
  plans: state.plans.map(n => {
    const item = n.find(m => m.id === action.id);
    return item
      ? n.map(m => m === item ? { ...m, value: action.value } : m)
      : n;
  }),
};

Добавляете в компонент свойство, которое будет указывать, случалось ли ваше событие. Если его значение false, тогда ничего не делаете, по умолчанию будет отрендерен чекбокс, если true - передаёте в соответствующий слот что там вам надо:

data: () => ({
  событиеНаступило: false,
  ...
}),

@событие="событиеНаступило = true"

<v-data-table>
  <template v-if="событиеНаступило" #item.data-table-select>
    здесь размещаете контент, который должен отображаться вместо чекбоксов
  </template>
  ...

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

<v-data-table>
  <template #item.data-table-select="{ item, isSelected, select }">
    <div v-if="item.событиеНаступило">hello, world!!</div>
    <v-simple-checkbox
      v-else
      :value="isSelected"
      @input="select($event)"
    ></v-simple-checkbox>
  </template>
  ...

На что надо заменить повторяющиеся элементы: const newValue = '!!!';.

Собираем новый массив:

const count = arr.reduce((acc, n) => (acc[n] = (acc[n] ?? 0) + 1, acc), {});
const newArr = arr.map(n => count[n] > 1 ? newValue : n);

// или

const newArr = arr.map(function(n) {
  return this.get(n) ? newValue : n;
}, arr.reduce((acc, n) => acc.set(n, acc.has(n)), new Map));

// или

const newArr = arr.map((n, i, a) => a.indexOf(n) !== a.lastIndexOf(n) ? newValue : n);

Обновляем существующий:

arr.forEach(function(n, i, a) {
  a[i] = ~-this.get(n) ? newValue : n;
}, arr.reduce((acc, n) => acc.set(n, -~acc.get(n)), new Map));

// или

const duplicates = arr.reduce((acc, n) => (acc[n] = acc.hasOwnProperty(n), acc), {});
arr.splice(0, arr.length, ...arr.map(n => [ n, newValue ][+duplicates[n]]));

// или

Object
  .values(arr.reduce((acc, n, i) => ((acc[n] ??= []).push(i), acc), {}))
  .forEach(n => n.length > 1 && n.forEach(i => arr[i] = newValue));

$('.payment-innovation .item').css('opacity', 0);

$('.payment-innovation .list-block__head').click(function() {
  const $this = $(this);
  const $items = $this.closest('.list-block').find('.item');
  const visible = $this.toggleClass('visible').hasClass('visible');
  const duration = 400;

  $items.each((i, n) => $(n)
    .delay((visible ? i : $items.length - i - 1) * duration)
    .animate({ opacity: +visible }, duration)
  );
}).click();

Не повторяются.

Поскольку управление отображением всех диалогов завязано на одно и то же свойство (v-model="dialog_destroy"), то при открытии любого из них открываются все и вы всегда видите только последний - он скрывает собой остальные.

Пусть видимостью диалогов управляют разные свойства:

data: () => ({
  showDialog: {},
  ...
}),

<v-dialog v-model="showDialog[item.свойствоИмеющееУникальныеЗначенияДляКаждогоItem]">

<v-btn @click="showDialog[item.свойствоИмеющееУникальныеЗначенияДляКаждогоItem] = false">Отменить

Можно и без дополнительного объекта обойтись, хранить информацию о состоянии диалога среди прочих данных:

<v-dialog v-model="item.showDialog">

<v-btn @click="item.showDialog = false">Отменить

Также можно вынести шаблон диалогового окна за пределы таблицы, чтобы оно было одно на всех:

data: () => ({
  dialogData: null,
  ...
}),

<v-data-table>
  <template #item.action="{ item }">
    <v-btn @click="dialogData = item">Удалить контакт</v-btn>
  </template>
</v-data-table>

<v-dialog :value="!!dialogData" @input="dialogData = $event">
  <span>Удалить контакт: @{{ dialogData?.contact_name }}</span>
  <v-btn :href="dialogData?.destroy_link">Подтвердить</v-btn>
  <v-btn @click="dialogData = null">Отменить</v-btn>
</v-dialog>