0xD34F

const rows = [items.map(item => item)];

Что это и зачем? Вы явно не понимаете, что здесь делаете. Передавайте items в DataGrid как есть, не надо ерундой заниматься.

И как быть в случае подобных вложенностей, когда мне от объекта user нужен только его username?

А как же

Все делаю по образцу из официальной документации к Material

??

Там, в документации, есть пример того, как следует подсовывать значения, отсутствующие непосредственно в объекте строки. Добавьте в определение колонки valueGetter: params => params.row.user.username.

Не нужно дёргать карту напрямую. Сделайте массив с данными маркеров, заполняйте его по клику, и на его основе создавайте экземпляры компонента маркера:

import { yandexMap, ymapMarker, loadYmap } from 'vue-yandex-maps';

components: {
  yandexMap,
  ymapMarker,
},
data: () => ({
  coords: null,
  markers: [],
  settings: { /* ... */ },
}),
methods: {
  onClick(e) {
    this.markers.push({
      id: 1 + Math.max(0, ...this.markers.map(n => n.id)),
      coords: e.get('coords'),
    });
  },
},
async mounted() {
  await loadYmap({ ...this.settings, debug: true });

  ymaps.geolocation.get().then(res => {
    this.coords = res.geoObjects.position;
  });
},

<yandex-map
  v-if="coords"
  :coords="coords"
  @click="onClick"
>
  <ymap-marker
    v-for="n in markers"
    :key="n.id"
    :marker-id="n.id"
    :coords="n.coords"
  ></ymap-marker>
</yandex-map>

https://jsfiddle.net/f65hraxk/

data: () => ({
  slides: [
    'путь к первой картинке',
    'путь ко второй картинке',
    ...
  ],
}),

<slide v-for="(n, i) in slides" :index="i">
  <figure>
    <img :src="n">
  </figure>
</slide>

(\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-функцию. А вы что показали?

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 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) > 1 ? 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 => duplicates[n] ? newValue : n));

// или

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