0xD34F

Смотрим 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)

def sum_items(arr):
  result = {}

  for item in arr:
    v, k = int(item[:-1]), item[-1]
    result[k] = result.get(k, 0) + v

  return [ str(v) + k for k, v in result.items() ]

function getPaths(obj, path = [ '' ]) {
  const entries = Object.entries(obj);
  return entries.length
    ? entries.reduce((acc, n) => (
        path.push(n[0]),
        acc.push(...getPaths(n[1], path)),
        path.pop(),
        acc
      ), [])
    : [ path.join('/') ];
}

provide / inject

В корневом компоненте дерева:

provide() {
  return {
    treeRoot: this,
  };
},

Во вложенном:

inject: [ 'treeRoot' ],

@click="treeRoot.$emit('item-click', item)"

В клиентском коде:

methods: {
  onItemClick(item) {
    // ...
  },
},

@item-click="onItemClick"

https://codesandbox.io/s/elated-jennings-jeb07?fil...

str
  .delete(' ')
  .split('')
  .reduce(Hash.new(0)){|acc, n| acc[n] += 1; acc}
  .each{|k, v| puts "#{k}: #{v}"}

Вместо повторной инициализации следует обновлять центр карты и координаты маркера:

<div ref="map"></div>

data: () => ({
  coords: [ ... ],
}),
methods: {
  initMap() {
    this.map = new ymaps.Map(this.$refs.map, {
      center: this.coords,
      zoom: 8,
    });

    this.marker = new ymaps.Placemark(this.coords, {
      hintContent: 'hello, world!!',
    });

    this.map.geoObjects.add(this.marker);

    this.map.events.add('click', this.onMapClick);

    this.$watch('coords', this.updateMap);
  },
  onMapClick(e) {
    this.coords = e.get('coords');
  },
  updateMap() {
    this.map.panTo(this.coords);
    this.marker.geometry.setCoordinates(this.coords);
  },
},
created() {
  ymaps.ready(this.initMap);
},

function shortNumber(val) {
  const abs = Math.abs(val);
  const prefixIndex = Math.log10(abs) / 3 | 0;
  return (
    (val < 0 ? '-' : '') +
    Math.round(abs / (10 ** (prefixIndex * 3))) +
    'KMGTPEZY'.charAt(~-prefixIndex)
  );
}

shortNumber(99)       // '99'
shortNumber(1945)     // '2K'
shortNumber(-5839465) // '-6M'
shortNumber(7e10)     // '70G'