0xD34F

Указали строго девять символов после восьмёрки - а в примере их всего семь. Указывайте переменное количество, минимум-максимум - вместо {9} пусть будет {4,9}, например. Или {6,9}. Или... Сами решайте, сколько их должно быть, вам виднее.

Кроме того, шестнадцатеричные числа - это не a-z, а a-f.

Одно значение (первое):

const val = arr.find(n => n.hasOwnProperty(key))?.[key];

Все, что есть:

const vals = arr.reduce((acc, n) => (n.hasOwnProperty(key) && acc.push(n[key]), acc), []);

Пробовал input в label положить вообще не помогает

помогает

Предлагаю погуглить, что такое асинхронность.

Сейчас у вас так: запросили данные, построили график, получили данные.

Добавьте в компонент слот:

<slot name="placeholder"></slot>

Соответственно, при использовании компонента можете что-то в этот слот передать:

<template #placeholder>
  <option value="" disabled>давай, выбирай</option>
</template>

https://jsfiddle.net/zc53rugL/

Смотрим data-атрибут кликнутого элемента, находим все элементы с таким же значением:

document.addEventListener('click', e => {
  const number = e.target.closest('[data-number]')?.dataset.number;
  if (number) {
    document.querySelectorAll(`[data-number="${number}"]`).forEach(n => n.remove());
  }
});

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

const lists = document.querySelectorAll('.list');
lists.forEach(n => n.addEventListener('click', onClick));

function onClick(e) {
  const i = Array.prototype.indexOf.call(this.children, e.target.closest('li'));
  if (i !== -1) {
    lists.forEach(n => n.removeChild(n.children[i]));
  }
}

Экземпляр компонента, отображающего статьи, не создаётся заново при смене категории, поэтому хук mounted не вызывается. Соответственно, метод getArticles не вызывается тоже - вот статьи и не обновляются.

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

watch: {
  alias: {
    immediate: true,
    handler: 'getArticles',
  },
},

function haveSameValues(arr1, arr2) {
  if (arr1.length !== arr2.length) {
    return false;
  }

  const count = new Map;
  arr1.forEach(n => count.set(n, -~count.get(n)));
  arr2.forEach(n => count.set(n, ~-count.get(n)));

  for (const n of count.values()) if (n) {
    return false;
  }

  return true;
}

haveSameValues(
  [ 'hello, world!!', 0, 0, 0, 1, 1, false, false ],
  [ false, false, 1, 1, 0, 0, 0, 'hello, world!!' ]
) // true

haveSameValues(
  [ 1, 2, 3 ],
  [ 3, 2, 2 ]
) // false

haveSameValues(
  [],
  []
) // true

str.gsub(/\w+/, '\'%\0%\'')

Выдёргиваем из элементов массив текстов, уникализируем его, собираем массив объектов:

const arr = Array.from(
  new Set(Array.from(document.querySelectorAll('.shop_name'), n => n.innerText)),
  n => ({ name: n })
);

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

const arr = Object.values(Array.prototype.reduce.call(
  document.getElementsByClassName('shop_name'),
  (acc, { textContent: name }) => (acc[name] ??= { name }, acc),
  {}
));

Можно директиву сделать:

function onClick({ currentTarget: t }) {
  const className = t.dataset.activeClass;
  document.querySelector(`.${className}`)?.classList.remove(className);
  t.classList.add(className);
}

Vue.directive('active-class', {
  bind(el, binding) {
    el.dataset.activeClass = binding.value;
    el.addEventListener('click', onClick);
  },
  update(el, binding) {
    el.dataset.activeClass = binding.value;
  },
  unbind(el) {
    delete el.dataset.activeClass;
    el.removeEventListener('click', onClick);
  },
});

<div v-active-class="'buy-voucher__amount_selected'">
<input v-active-class="'buy-voucher__amount_selected'">

Что значит "не обрабатывает"? Не рендерит? А есть где? Вложенный router-view не забыли добавить?

JS есть JS, всё как обычно:

- arr = [ 1, 2, 3, 4, 5, 6, 7, 8 ]

mixin xxx(arr, method, ...args)
   - newArr = arr[method](...args)
   p= newArr

+xxx(arr, 'slice', 2, 5)
+xxx(arr, 'filter', n => n & 1)

Правда, неясно, зачем вообще передавать имя метода и производить какие-то манипуляции внутри, если это можно делать снаружи:

- arr = [ 1, 2, 3, 4, 5, 6, 7, 8 ]

mixin xxx(arr)
  ul
    each n in arr
      li= n

+xxx(arr.slice(-3))
+xxx(arr.filter(n => !(n % 3)))

А может, всё-таки рендерится? Значение link не обновляется при изменении props.link, так что эффект не срабатывает - отсюда отсутствие внешних изменений при повторных рендерингах.

Уберите link, он вам тут не нужен, используйте в эффекте сразу props.link:

React.useEffect(() => {
  fetch(props.link)
    .then(r => r.json())
    .then(setItems);
}, [ props.link ]);

count = {}

for n in sum([ m[::2] for m in arr ], []):
  count[n] = count.get(n, 0) + 1

^\d{1,4}(\.\d{1,2})?([+-]\d{1,4}(\.\d{1,2})?){0,3}$

Перезаписываем разметку:

wrapper.innerHTML = Array
  .from(word.value, n => obj[n] ? `<img src="${obj[n]}">` : '')
  .join('');

Или, удаляем существующие узлы и создаём новые:

for (let n = null; n = wrapper.lastChild; n.remove()) ;

for (const n of word.value) {
  if (obj.hasOwnProperty(n)) {
    const img = new Image;
    img.src = obj[n];
    wrapper.append(img);
  }
}

// или

wrapper.replaceChildren(...Array.prototype.reduce.call(
  word.value,
  (acc, n) => (
    obj[n] && ((acc[acc.length] = new Image).src = obj[n]),
    acc
  ),
  []
));

Или, удаляем лишние/создаём недостающие узлы:

while (word.value.length < wrapper.children.length) {
  wrapper.removeChild(wrapper.lastElementChild);
}

while (word.value.length > wrapper.children.length) {
  wrapper.appendChild(document.createElement('img'));
}

Array.prototype.forEach.call(wrapper.children, (n, i) => {
  const src = obj[word.value[i]];
  if (!(n.hidden = !src)) {
    n.src = src;
  }
});

Конечно, вопрос был про другое, но это просто чудовищно:

let obj = {
    'а': 'https://github.com/itsFide/converter/blob/master/img/а.png?raw=true',
    'А': 'https://github.com/itsFide/converter/blob/master/img/а.png?raw=true',
    'б':'https://github.com/itsFide/converter/blob/master/img/б.png?raw=true',
    ...

Давайте-ка сократим:

const obj = Object.fromEntries(Array.prototype.flatMap.call(
  'абвгдеёжзийклмнопрстуфхцчшщъыьэюя', n => {
    const url = `https://github.com/itsFide/converter/blob/master/img/${n}.png?raw=true`;
    return [
      [ n,               url ],
      [ n.toUpperCase(), url ],
    ];
  }
));

re.search(f'{нужный_символ}(\d+)', string).group(1)