Heretic Man

JSON.parse / eval

ну или

({
  'false': false,
  'true': true,
})[str]

Добавьте свойство flightsData, куда будете складывать данные, изначально - пустой массив.

Выводите его содержимое в шаблоне, например:

<div v-for="item in flightsData">
  <div>Price: {{ item.price }}</div>
  <div v-for="f in item.flights">
    <div>Departure: {{ f.cities.departureCity }}, {{ f.departureTime }}</div>
    <div>Arrival: {{ f.cities.arrivalCity }}, {{ f.arrivalTime }}</div>
  </div>
</div>

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

this.flightsData = response.data.filter(n => val.includes(n.flights[0].airline.code));

function filterPages(filter) {
  axios.get(`https://deliver.kenticocloud.com/22769d7b-d48a-0063-422b-ebbecb2a9b36/items?system.type=product_group&elements.meta[contains]=${filter}`)
    .then(({data}) => processData(data))
    .catch(() => alert('faied'));
};

При удалении в splice надо указывать индекс, а не сам элемент:

methods: {
  select(airline) {
    const index = this.selected.indexOf(airline);
    if (index !== -1) {
      this.selected.splice(index, 1);
    } else {
      this.selected.push(airline);
    }
  },
},

Свойство checkedAll должно быть вычисляемым, с сеттером:

computed: {
  checkedAll: {
    get() {
      return this.airlines.every(n => this.selected.includes(n.name));
    },
    set(val) {
      this.selected = val ? this.airlines.map(n => n.name) : [];
    },
  },
},

AJAX запрос <...> нужен watch?

Можно так, да.

что лучше использовать

axios

data: () => ({
  items: [
    { active: false, text: '...' },
    { active: false, text: '...' },
    ...
  ],
}),

<div
  v-for="n in items"
  v-text="n.text"
  :class="[ { active: n.active }, 'toggle' ]"
  @click="n.active = !n.active"
></div>

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

а как сделать чтобы не городить кучу даныx в data?

Типа, лучше городить ещё большую кучу html кода? Нет, так дела не делаются. По крайней мере, при использовании vue, тут данные первичны.

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

data: () => ({
  itemsCount: 5,
  active: [],
}),
methods: {
  toggle(item) {
    const i = this.active.indexOf(item);
    if (i === -1) {
      this.active.push(item);
    } else {
      this.active.splice(i, 1);
    }
  },
},

<div
  v-for="i in itemsCount"
  v-text="`Item ${i}`"
  :class="[ { active: active.includes(i) }, 'toggle' ]"
  @click="toggle(i)"
></div>

Про погружение есть такая штука называется рекурсия

Вот пример реализации такого как вам надо, под себя подпилите

function wpp_bt_shop_by_menu_items() {
	if ( false === ( $html = get_transient( 'wpp_bt_shop_by_nav' ) ) ) {

		$html      = '';
		$locations = get_nav_menu_locations();
		if ( $locations && isset( $locations['shop_by'] ) ) :
			$menu       = wp_get_nav_menu_object( $locations['shop_by'] );
			$menu_items = wp_get_nav_menu_items( $menu );
			foreach ( $menu_items as $menu_item ):
				$term = $menu_item->type === 'taxonomy' ? get_term( $menu_item->object_id ) : null;
				$html .= wpp_bt_crate_items_list( $term, $menu_item );
			endforeach;
		endif;

		set_transient( 'wpp_bt_shop_by_nav', $html, 24 * HOUR_IN_SECONDS );

	}

	return apply_filters( 'wpp_bt_shop_by_nav_items', $html );
}

/**
 * Product cat naw menu item
 *
 * @param $term
 * @param $menu_item
 *
 * @return string
 */
function wpp_bt_crate_items_list( $term, $menu_item) {
	$html = '';

	if ( $menu_item === null || ( $menu_item !== null && $menu_item->menu_item_parent == 0 ) ) {

		if ( $menu_item === null || ( $menu_item !== null && $menu_item->object === 'product_cat' ) ) {

			if ( wpp_instock_product_count_in_term( $term->term_id ) > 0 || ( $menu_item->object_id === BT_LATEST_PRODUCT_TERM ) ) {


					$children = get_categories(
						array(
							'hide_empty' => true,
							'taxonomy'   => 'product_cat',
							'parent'     => $term->term_id
						)
					);

					$class = count( $children ) > 0 ? 'has-child' : 'cat-no-child';
					$title = $menu_item ? $menu_item->title : $term->name;

					$html .= sprintf( '<li class="cat-item cat-item-%s %s">', $term->term_id, $class );
					$html .= sprintf( '<a href="%1$s" title="%2$s">%2$s</a>', get_term_link( $term->term_id ), $title );

					if ( count( $children ) > 0 ) {
						$html .= '<ul class="children">';

						foreach ( $children as $child ) {
							if ( $child->count > 0 ) {
								$html .= wpp_bt_crate_items_list( $child, null );
							}
						}

						$html .= '</ul>';
					}

					$html .= '</li>';

			}

		} else if ( $menu_item->object == 'custom' ) {

			$children = get_menu_item_children(
				array(
					'parent' => $menu_item->ID
				)
			);

			$class = count( $children ) > 0 ? 'has-child' : 'cat-no-child';

			$html .= sprintf( '<li class="cat-item cat-item-%s %s">', $menu_item->ID, $class );
			$html .= sprintf( '<a href="%1$s%2$s" title="%3$s">%3$s</a>', get_home_url(), $menu_item->url, $menu_item->title );

			if ( count( $children ) > 0 ) {
				$html .= '<ul class="children">';

				foreach ( $children as $child ) {

					$html .= sprintf( '<li class="cat-item cat-item-%s cat-no-child">', $child->ID );
					$html .= sprintf( '<a href="%1$s%2$s" title="%3$s">%3$s</a>', get_home_url(), $child->url, $child->title );
				}

				$html .= '</ul>';
			}

			$html .= '</li>';
		}
	}

	return $html;
}

fetch('https://zakup.sk.kz/eprocpko/api/nomenclatures?search='+nomenclatures[i]+'&page=-1&size=10&sort=tru.code,asc&sort=tru.category,asc')
.then(response => response.json).then(data => функция(data))

В функции делаешь проверку свою и отправляешь еще один fetch(url, { headers: [{'Content-type', 'application/json'}])

Если надо ловить ошибку юзай catch

Пишете в B1 формулу:
=И(ДЛСТР(A1)=17;ПСТР(A1;7;1)=".";ПСТР(A1;11;1)=".")
Копируете вниз.
Получите ИСТИНА там, где нужная строка. ЛОЖЬ - где ненужная. Удаляете строки, в которых ЛОЖЬ

const max = Math.max(...Object.values(obj[0]).map(n => n ? n.level : -Infinity));

Использую vscode+webpack+pug+scss+бэм. Из физических инструментов, основной моник: lg ultrawide 29um69g, рядом прикручен моник от ноутбука повешенный вертикально, подключенный через универсальный скаллер.

0) Запускаю Spotify :-)

1) Произвожу установку всех необходимых модулей для сборки. В моем случае у меня набор конфигураций для webpack (отдельные файлы для pug, scss, static и.т.д., выбираю что нужно).

2) Запускаю avocode, загружаю в него макет. Определяю в нем переменные (в то же время записываю их, чтобы сразу кинуть в scss файл) для цветов, размеров шрифтов и.т.д. чтобы при получении кусочков кода из него, он сразу расставлял переменные.

3) Запускаю VS Code, открываю нужную папку.

4) Пишу размету на Pug. Пишу с БЭМ, если встречаю повторяющийся блок, то открываю файл _mixins.pug, в который пишу миксины для повторяющихся блоков, например товаров, пунктов меню, каких-то блоков и.т.д. Pug умеет делать циклы, это ускоряет сильно.

5) Когда HTML готов, начинаю делать каркас. Если дизайн сделан по сетке, определяю контейнеры, колонки, строки в свои классы (не пишу в html тучи классов аля col-md-6, а пишу в SCSS инклуды в нужные мне блоки, типа @include make-col(2) и.т.д.).

6) Экспортирую картинки из Avocode. Очень делается просто, указываю папку и просто кликаю экспорт и ввожу название файла и расширения. Преимущественно для иконок использую svg, если нет svg, то ищу эту иконку в интернете (дизайнеры редко рисуют иконки сами, но зато любят вставлять их не в векторе). Если иконка простая, могу сам ее в inkscape обвести, ну и если нет, то экспортирую png в 2х размере (благо авокод это позволяет, если конечно дизайнер не вставил в исходном маленьком размере). Когда есть контакт с дизайнером, трясу его, ибо растр это плохо для иконок.

7) Пишу стили блоков из страницы. На этом этапе можно на втором монике параллельно смотреть футураму или
Арчера :-) Но чаще на широком монике слева браузер, справа VS Code, а на втором монике Avocode (может меняться местами с браузером). Мысленно нарезаю страницу на блоки. Для каждого блока (БЭМ) создаю отдельный scss файл (кто-то даже для элемента создает, но мне лень), из него сразу выписываю все селекторы. Иногда могу сначала выписать все селекторы со страницы (но так лучше не делать, т.к. во время работы может потребоваться изменить что-то в разметке), но чаще для одного блока выполняю этот пункт и за ним сразу выполняю пункт 8, потом для нового блока опять 7 и 8 и.т.д.

8) Пишу css код вместе с Avocode, у него беру нужные мне параметры (а он уже подставил в них переменные), и вставляю в мой код. И параллельно сверяю со скрином макета используя вот это расширение https://chrome.google.com/webstore/detail/perfectp...

9) Пишу адаптив. Я не могу привыкнуть к методологии mobile-first, поэтому пишу всегда сначала полную версию сайта. Я понимаю, что это чревато всякими проблемами и это типа не модно, но мне норм.

10) Медиа-запросы пишу прямо в блоках, для каждого блока/элемента/модификатора может быть отдельный медиа-запрос. Но для начала определяю breakpoint'ы для разных экранов (чтобы их не было сотни разных), если использую Bootstrap, то беру его breakpoint'ы.

11) Добавляю анимашки. Даже если заказчик не просил отдельно (и если не указал отдельно, что нельзя), он все равно будет доволен, а с animate.css+onscreen.js это вообще работа 10 минут. Сложные анимации обговариваю отдельно, чтобы не сделать ненужную работу.

11) Все снова сверяю, пишу скрипты где надо. Для слайдеров в 99% случаев подходит slick (с доработками конечно, но там хорошее API), для других случаев могу написать свой.

12) Сдаю заказчику и жду ответа сидя на тостере/пикабу.

Это чисто мой опыт, опыт фрилансера, не знаю, как делают другие и не могу на 100% утверждать что это 100% правильный способ. Я так и не смог заставить свой конфиг webpack правильно вставлять спрайты svg.
Надеюсь чем-то поможет мой ответ.

xhr.onreadystatechange = function() {
   if(this.readyState == this.HEADERS_RECEIVED) {
      var headers = xhr.getAllResponseHeaders(); // Тут заголовки
   }
}
xhr.send();

Вот полный пример, как получить заголовки в виде строки и преобразовать их в массив https://developer.mozilla.org/en-US/docs/Web/API/X...

UPD: вот так можно перехватить заголовки с "чужого" xhr

var send = XMLHttpRequest.prototype.send;
  XMLHttpRequest.prototype.send = function() {
    this.addEventListener('readystatechange', function() {
      // тут добавляем сравнение текущего урла  this.responseURL, чтобы обрабатывались только запросы, которые начинаются на такую строку
      if (this.readyState === 4 && this.responseURL.startsWith('https://zakup.sk.kz/eprocpko/api/nomenclatures?search')) {
        console.warn(this.getAllResponseHeaders());
      }
    }, false);
    send.apply(this, arguments);
  };

После изменения поле скриптом просто вызвать евент onchange, если он уонечно существует

В общем случае - никак. Этот обработчик запросто может проверять события на isTrusted, и тогда обмануть его не получится. Конкретно в вашем случае, вполне возможно, что он случает не change, а keyup, input или blur, например, или что обработчики навешиваются на какой-то из рдительских элементов. Гадать практически бесполезно, лучше это время потратить на то, чобы научится в дебаггер.
https://developers.google.com/web/updates/2015/05/...