0xD34F

$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}`)) ;

Где вызов экшена GET_CHARACTERS? Не вижу. Надо добавить.

let data = await axios.get(baseURL);
context.commit('SET_CHARACTERS', data)

Здесь вы передаёте в мутацию объект ответа целиком - не только данные, но ещё и статус, заголовки и т.д. Кроме того, судя по дефолтному значению characters, вы желаете получить массив, а возвращается объект, содержащий массив в качестве значения свойства results. Так что пусть будет

const response = await axios.get(baseURL);
context.commit('SET_CHARACTERS', response.data.results);

<div>{{ $store.state.characters }}</div>

Раз выводите массив - выводите его поэлементно:

<div v-for="n in $store.state.characters">
  {{ n.name }}
</div>

UPD. https://jsfiddle.net/o3wszLdv/

filters: {

vue@next

Интересно, что по этому поводу говорит документация? А вот что:

In 3.x, filters are removed and no longer supported. Instead, we recommend replacing them with method calls or computed properties.

- ([a-zA-Z0-9]+)
+ ([\\w-]+\\/)+

- const linkBase = "ozon.ru";
+ const linkBase = "ozon\\.ru";

Вынести .zoom за пределы карты, добавить общую обёртку с относительным позиционированием:

<div class="map-wrapper">
  <div class="zoom">
    <div data-zoom="+1" class="zoom-in"></div>
    <div data-zoom="-1" class="zoom-out"></div>
  </div>
  <div class="map"></div>
</div>

.map-wrapper {
  position: relative;
}

Чтобы .zoom отображался поверх карты, задать ему z-index и абсолютное позиционирование:

.zoom {
  position: absolute;
  z-index: 666;
}

Добавить обработчик клика по кнопкам:

document.querySelector('.zoom').addEventListener('click', function(e) {
  const zoomChange = +e.target.dataset.zoom;
  if (zoomChange) {
    map.setZoom(map.getZoom() + zoomChange);
  }
});

https://jsfiddle.net/mu32azvy/

Работает.

Почему вы этого не видите? Погуглите, что такое всплытие событий. Затем, держа в голове свежеприобретённые знания, присмотритесь к этому коду:

function fb3cont() {

  b3Cont.classList.remove("__active");
}
document.onclick = function() {
  if (b3Cont.classList.contains("__active")) { fb3cont()};
}

stats = { n['name']: n['value'] for n in r['playerstats']['stats'] }

Array.new(counter){|i| [ "counter #{i + 1}", arr ]}.flatten

Разберитесь с приоритетом операторов.

Давайте-ка скобок добавлю, чтобы яснее стало, что в каком порядке выполняется:

('ic' + true) ? 'on' : ('off' + '.svg')

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

computed: {
  className() {
    return условие ? 'icon.svg' : 'icoff.svg';
  },
  ...

<p :class="className">

orderBy(data, [ n => n.updatedEl ?? n.createdEl, 'desk' ])