0xD34F

Сортируем существующий массив:

arr.sort((a, b) => {
  return Number.isNaN(+a) || Number.isNaN(+b)
    ? a.localeCompare(b)
    : a - b;
});

// или

arr.sort((a, b) => (a - b) || a.localeCompare(b));

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

const sorted = (arr, keys) => arr
  .map(n => [ n ].concat(keys(n)))
  .sort((a, b) => {
    let diff = 0;
    a.find((n, i) => diff = i && ((n < b[i]) ? -1 : +(n > b[i])));
    return diff;
  })
  .map(n => n[0]);

const sortedArr = sorted(arr, n => [ +n, n.toLowerCase() ]);

(?<=ИНН )\d+

chunk_size = 3
newString = ' '.join(string[i:i + chunk_size] for i in range(0, len(string), chunk_size))

data: () => ({
  sortOptions: [
    { value: 'PriceMinMax', text: 'сначала дешевле' },
    { value: 'PriceMaxMin', text: 'сначала дороже' },
  ],
  ...
}),

<ul>
  <li
    v-for="n in sortOptions"
    v-text="n.text"
    :class="{ active: sortBy === n.value }"
    @click="sortBy = n.value"
  ></li>
</ul>

li.active {
  color: red;
}

data() {
  return {
    dates: [ массив допустимых дат, в числовом виде (количество миллисекунд) ],
    disabledFn: {
      customPredictor: date => !this.dates.includes(new Date(date).setHours(0, 0, 0, 0)),
    },
  };
},

<datepicker :disabledDates="disabledFn" />

https://codesandbox.io/s/for-httpsqnahabrcomq97203...

суть вопроса, можно ли обойтись без computed свойства, для получения длины получаемого массива в watch?

Можно. Длину и отслеживайте:

watch: {
  'notifications.length'(newValue, oldValue) {
    ...

Давайте напишем функцию, принимающую массив и, опционально, имя свойства, которое должно будет содержать ссылку на следующий элемент списка. Чтобы можно было делать так:

const list = arrToSinglyLinkedList(arr, 'child');

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

const arrToSinglyLinkedList = (arr, nextKey = 'next') =>
  arr.reduceRight((acc, n) => ({ ...n, [nextKey]: acc }), null);

// или

function arrToSinglyLinkedList(arr, nextKey = 'next') {
  let list = null;

  for (let i = arr.length; i--;) {
    const node = Object.assign({}, arr[i]);
    node[nextKey] = list;
    list = node;
  }

  return list;
}

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

const arrToSinglyLinkedList = (arr, nextKey = 'next', i = 0) =>
  i < arr.length
    ? Object.fromEntries([
        ...Object.entries(arr[i]),
        [ nextKey, arrToSinglyLinkedList(arr, nextKey, -~i) ]
      ])
    : null;

// или

function arrToSinglyLinkedList(arr, nextKey = 'next', i = 0, n = arr[i]) {
  const node = n ? {} : null;
  if (node) {
    for (const k in n) {
      if (n.hasOwnProperty(k)) {
        node[k] = n[k];
      }
    }
    node[nextKey] = arrToSinglyLinkedList(arr, nextKey, i + 1);
  }

  return node;
}

присваивание всем переменным, которые используются в компоненте, их дефолтное значение мне тоже кажется не лучшей идеей

Кроме "кажется" другие возражения против данного способа есть?

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

const items = document.querySelectorAll('.b1');
let toggle = 0;

document.querySelector('button').addEventListener('click', () => {
  toggle ^= 1;
  items.forEach((n, i) => n.classList.toggle('_tog-sw', i & 1 ^ toggle));
});

$t = &$arr;

foreach ($keys as $key) {
  if (!isset($t[$key]) || !is_array($t[$key])) {
    $t[$key] = [];
  }

  $t = &$t[$key];
}

$t['value'] = $val;

Используйте currentTarget, если внутри обработчика нужен элемент, к которому обработчик привязан.

Или вместо объекта события можете воспользоваться this - это и будет ссылка на нужный элемент. Конечно, только в том случае, если какое-то другое значение не было заранее привязано к обработчику (как такое может быть - bind и стрелочные функции).

Ещё бывает так (не ваш случай, но упомянуть стоит), что обработчик висит выше нужного элемента - в этом случае можно подняться до него от target с помощью closest.

Очевидно же раз - понизить используемую версию chart.js. Так, чтобы первой цифрой была 2, а не 3.

Очевидно же два - подождать, пока выйдет версия vue-chartjs с поддержкой третьего chart.js.

Очевидно же три - форкнуть vue-chartjs и реализовать поддержку третьего chart.js самостоятельно.

Элементы исходного массива - это данные столбцов. Соответственно, получаете количество строк (максимальная из длин вложенных массивов) и в качестве значения rowspan последним элементам столбцов устанавливаете

1 + количество_строк - количество_элементов_в_данных_текущего_столбца

https://jsfiddle.net/th7w51kp/

чем это может быть вызвано?

Тем, что значение isLoadError меняется только с false на true. Надо его как-то обратно сбрасывать.

Можно следить за значением src, если изменилось, выставлять false:

useEffect(() => setIsLoadError(false), [ src ]);

Другой вариант - в ImagePopup пересоздавать экземпляр компонента Image при изменении данных карточки, указав соответствующий ключ:

<Image key={card ? card.link : 'hello, world!!'}

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

Всё работает так, как и должно. Обратите внимание на значения атрибута name - они совпадают у разных строк.

А вообще, две радиокнопки тут не нужны - достаточно одного чекбокса.

через render-функцию

UPD. Вынесено из комментариев:

код же можно изменить под vue 3, да?

да

const word = 'сейчас';

const newStr = str.replace(RegExp(`(?<=(^|\\s)${word})\\s.*`), '');

Правда, подозреваю, что вам надо не совсем это. Может, заменить цифры в конце строки? Это было бы проще:

str.replace(/\d+$/, новое_число)

const sum = arr => arr
  .flatMap(Object.entries)
  .reduce((acc, [ k, v ]) => (
    acc[k] = acc.hasOwnProperty(k) ? acc[k] + v : v,
    acc
  ), {});


const obj = sum(arr);

Кто у элемента родитель, какой класс обозначает активность, и сам элемент:

const parent = document.querySelector('.xlist');
const className = 'active';
const el = parent.querySelector(`:scope > .${className}`);

Какие есть варианты получения индекса:

const index = el ? [...parent.children].indexOf(el) : -1;

или

let index = -1;
for (let n = el; n; n = n.previousElementSibling, index++) ;

или

const index = Array.prototype.findIndex.call(
  parent.children,
  n => n.classList.contains(className)
);

или

const { children } = parent;
let index = children.length;
while (index-- && !children[index].matches(`.${className}`)) ;