0xD34F

Ключевое слово в качестве имени свойства? Умно, ничего не скажешь.

Перед кем и что надо добавить:

const elements = document.querySelectorAll('li > ul');
const tag = 'span';
const text = 'hello, world!!';

Добавляем:

elements.forEach(n => {
  n.before(document.createElement(tag));
  n.previousSibling.textContent = text;
});

или

for (const n of elements) {
  const el = document.createElement(tag);
  el.innerText = text;
  n.parentNode.insertBefore(el, n);
}

или

for (let i = 0; i < elements.length; i++) {
  elements[i].insertAdjacentHTML('beforebegin', `<${tag}>${text}</${tag}>`);
}

или

(function insert(i, n = elements.item(i)) {
  if (n) {
    const el = document.createElement(tag);
    el.appendChild(new Text(text));
    n.insertAdjacentElement('beforebegin', el);
    insert(-~i);
  }
})(0);

$('.list-item').filter((i, n) => $(n).data('pagereview') !== $(n).data('pageslug')).hide();

или

$('[data-pageslug]').each(function() {
  const $this = $(this);
  $this.toggle($this.attr('data-pagereview') === $this.attr('data-pageslug'));
});

или

document.querySelectorAll('.list-item').forEach(n => {
  n.hidden = n.getAttribute('data-pagereview') !== n.getAttribute('data-pageslug');
});

или

for (const { style, dataset } of document.getElementsByClassName('list-item')) {
  if (dataset.pagereview !== dataset.pageslug) {
    style.display = 'none';
  }
}

или

.hidden {
  display: none;
}

const items = document.querySelectorAll('[data-pageslug]');
for (let i = 0; i < items.length; i++) {
  const { classList: c, attributes: a } = items[i];
  c.toggle('hidden', a['data-pagereview'].value !== a['data-pageslug'].value);
}

:options="{ scrollWheelZoom: false }"
@update:zoom="zoom = $event"
@wheel.native="onWheel"

methods: {
  onWheel(e) {
    if (e.deltaY < 0) {
      this.zoom++;
      e.preventDefault();
    }
  },
},

data: () => ({
  columns: [ 'aaa', 'bbb', 'ccc' ],
  repeat: 5,
}),
computed: {
  repeatedColumns() {
    return Array(this.repeat).fill(this.columns).flat();
  },
},

<td v-for="n in repeatedColumns">{{ n }}</td>

Добавьте в option'ы свойство, которое будет указывать, на что надо умножать price:

options: [
  {
    ...
    propToBeMultipliedByPrice: 'area',
  },
  {
    ...
    propToBeMultipliedByPrice: 'perimeter',
  },
],

И умножайте:

{{ option.price * calc[option.propToBeMultipliedByPrice] }}

Делаете общую функцию фильтрации, где получаете данные из всех фильтров и сравниваете их с элементами. Подключаете эту функцию ко всем фильтрам в качестве обработчика событий, возникающих при взаимодействии с ними пользователя. Например.

преобразовать
['a' => [11, 12], 'b' => [21, 22]]
в
[['a' => 11, 'b' => 12], ['a' =>21, 'b' => 22]]

Совершенно не очевидно, почему результат должен быть таким, как вы показали. Почему 12 из a становится значением свойства b, а 21 - наоборот? Опечатка? - наверное, в a исходного массива лежат значения свойств a результата, аналогично и с b.

array_map(fn($i) => array_combine(array_keys($arr), array_column($arr, $i)), array_keys(array_values($arr)[0]))

{{ dish[`title_${lang}`] }}

или

v-text="dish['title_' + lang]"

или

:text.prop="dish['title_'.concat(lang)]"

const widgetsTransform = Object
  .values(widgets.reduce((acc, n) => ((acc[n.type] = acc[n.type] || []).push(n), acc), {}))
  .map(n => n.length > 1 ? ({ type: `Section${n[0].type}`, children: n }) : n[0]);

не корректно работает

Слово "корректно" тут лишнее. Вообще ни хрена не работает.

Проверка у вас в методе, а методы - знаю, для вас прозвучит весьма неожиданно - их надо вызывать. Чего вы не делаете. Но, разумеется, добавление круглых скобок вам не сильно поможет - вызов будет происходить только при рендеринге, а он со скроллом не связан.

Правильно будет так: добавить свойство, хранящее текущий скролл; обновлять его по событию скролла (нужно повесить соответствующий обработчик на прокручиваемый элемент); назначать классы или чего там вам надо в зависимости от значения этого свойства:

data: () => ({
  scroll: 0,
}),
computed: {
  buttonClass() {
    return что-то, зависящее от значения this.scroll;
  },
},
created() {
  const { body } = document;
  const onScroll = () => this.scroll = body.scrollTop;
  body.addEventListener('scroll', onScroll);
  this.$on('hook:beforeDestroy', () => body.removeEventListener('scroll', onScroll));
},

<button :class="buttonClass"></button>

https://jsfiddle.net/kLwhbec5/

Сравниваете строки вместо чисел. Скрываете элементы, но не показываете их.

$('.price_min_max_btn').click(function() {
  const min = +$('.price_min').val() || 0;
  const max = +$('.price_max').val() || Infinity;

  $('.item_block_filter')
    .hide()
    .filter(function() {
      const price = +this.dataset.price;
      return min <= price && price <= max;
    })
    .show();
});

<div v-if="showHeader">

data: () => ({
  showHeader: +document.querySelector('#app_id').innerHTML === 92,
}),

замените

<div v-for="(story, idx) in stories" :key="idx">

на

<div v-for="n in stories.hits" :key="n.objectID">

.then(this.dates.push(response['dates'] ) ),

Всего одна строка, а столько косяков.

• Синтаксически некорректный мусор - что за запятая на конце? И ещё пересчитайте закрывающие скобки - одна лишняя, здесь, или на две строки ниже.
  
• В then надо передавать функцию. Которая в качестве параметра принимает непонятно откуда берущийся у вас в данный момент response.
  
• Непосредственно в response никакого свойства dates не будет - получаемые данные доступны через свойство data.
  
• Свойство компонента dates, должно, судя по названию, содержать массив дат. Свойство данных ответа dates, судя по названию, содержит массив дат. Так зачем второе засовывать внутрь первого целиком, как один элемент? Надо или заменить значение свойства компонента значением из ответа, или сделать даты из ответа элементами свойства компонента.
  

Исправляем:

.then(response => this.dates = response.data.dates)
// или
.then(response => this.dates.push(...response.data.dates))

Заверните код в класс и создавайте столько экземпляров, сколько потребуется.

https://jsfiddle.net/zx7dqjfp/

Как в данном случае правильно сделать...

Структуру данных менять нельзя

"Правильно" - никак. Непонятно, откуда должен будет взяться section.

Так что структуру данных изменить всё-таки придётся.

Сделайте вычисляемое свойство, которое будет представлять отфильтрованный список, и выводите его:

computed: {
  filteredDialogs() {
    const { dialogs, search } = this;
    return search
      ? dialogs.filter(n => n.fullname.includes(search))
      : dialogs;
  },
},

И избавьтесь от v-if:

v-if="dialogs.length > 0" v-for="(dialog, index) in dialogs"

Во-первых - бессмысленно (если данных нет, и так ничего не будет выведено). Во-вторых.

Потому что его нет. Обновление DOM происходит не сразу же после изменения данных. Используйте nextTick.

И избавьтесь от jquery. Поставьте ref на список:

<ul class="chat--messages__wrapper" ref="messages">

А после добавления данных делайте так:

this.$nextTick(() => {
  const { messages } = this.$refs;
  messages.scrollTop = messages.scrollHeight;
});

def countCarsByBrand(cars, brands):
  return sum(len(v.keys()) for k, v in cars.items() if k in brands)


print(countCarsByBrand(cars, [ 'Audi', 'BMW' ]))