0xD34F

const ancestor = 'селектор элементов, которые надо получить';
const descendant = 'селектор вложенных элементов';

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

Array.prototype.filter.call(
  document.querySelectorAll(ancestor),
  n => n.querySelector(descendant)
)

Вариант два - получаем тех, кто содержится внутри нужных элементов, поднимаемся вверх:

Array.from(
  document.querySelectorAll(`${ancestor} ${descendant}`),
  n => n.closest(ancestor)
)

Вариант три (ну, два с половиной) - получаем потенциальных потомков, пробуем подняться до нужных предков:

[...document.querySelectorAll(descendant)].reduce(
  (acc, n) => ((n = n.closest(ancestor)) && acc.push(n), acc),
  []
)

UPD. Наконец-то дождались (ну, почти):

document.querySelectorAll(`${ancestor}:has(${descendant})`)

new Date('Fri Oct 05 2018 00:00:00 GMT+0300 (Саудовская Аравия, стандартное время)') / 1000

Зачем onClick? - при повторном клике на инпут класс удалится, а клик снаружи инпута вы так не обработаете. Наверное, стоит использовать onFocus и onBlur:

class App extends React.Component {
  state = {
    classes: [ 'bullshit' ],
  }

  onFocus = () => {
    this.setState(({ classes }) => ({
      classes: [ ...classes, 'focus' ],
    }));
  }

  onBlur = () => {
    this.setState(({ classes }) => ({
      classes: classes.filter(n => n !== 'focus'),
    }));
  }

  render() {
    return (
      <div className={this.state.classes.join(' ')}>
        <input onFocus={this.onFocus} onBlur={this.onBlur} />
      </div>
    );
  }
}

Нет разницы - оба варианта некорректные, таких JSON'ов не бывает.

Конечно, на самом деле вы имели в виду кое-что другое, но... учитесь задавать вопросы.

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

[
  [   'region_id',   'regionName' ],
  [ 'district_id', 'districtName' ],
  [     'area_id',     'areaName' ],
  [     'city_id',     'cityName' ],
  [    'place_id',     'cityName' ],
  [        'name',   'streetName' ],
].forEach(([ del, search ]) => {
  if (this.tableParam[del]) {
    delete this.tableParam[del];
    this.searchForm.get(search).patchValue(null);
  }
});

$('input').inputmask({
  mask: '9{1,}.|,9',
  placeholder: ''
})

Ну типа вот.

state отказывается обновляться

Риторический вопрос - а с чего вы решили, что он должен обновляться? Вообще, подобные заблуждения имеют своей причиной крайне слабые знания js, задумайтесь над этим.

Проверяйте в componentDidUpdate, что props изменились - если да, делайте setState (побочным результатом будет двойное обновление компонента, можно избежать этого с помощью shouldComponentUpdate). Или используйте getDerivedStateFromProps.

А ещё лучше - хорошенько подумайте, действительно ли вам нужно дублировать props в state. Вероятно, есть вариант обойтись использованием только props.

Компонент Item, обработчик onImportantClick - надо останавливать всплытие события, чтобы оно не обрабатывалась ещё и в onItemClick, т.е.:

onImportantClick = (e) => {
  e.stopPropagation();
  this.setState(({ important }) => ({
    important: !important
  }));
};

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

const parent = document.querySelector('.box').parentNode;

const iMin = 2;
const iMax = 5;

const wrapper = document.createElement('div');
wrapper.classList.add('wrapper');

Получаем элементы, перемещаем:

if (parent.children[iMin]) {
  const elems = Array.prototype.slice.call(parent.children, iMin, iMax);
  elems[0].before(wrapper);
  wrapper.append(...elems);
}

// или

const elems = parent.querySelectorAll(`:nth-child(n + ${-~iMin}):not(:nth-child(n + ${-~iMax}))`);
if (elems.length) {
  parent.insertBefore(wrapper, elems[0]);
  elems.forEach(n => wrapper.appendChild(n));
}

// или

if (parent.children.length > iMin) {
  parent.children[iMin].insertAdjacentElement('beforebegin', wrapper);
  for (let i = iMax - iMin, n = null; i-- && (n = wrapper.nextElementSibling);) {
    wrapper.insertAdjacentElement('beforeend', n);
  }
}

Что значит "не промисы, а async/await"? - async/await это тоже промисы.

Используйте await Promise.all, например:

const result = await Promise.all([ 1, 2, 3 ].map((n, i) => {
  return new Promise(resolve => {
    setTimeout(() => {
      console.log(`timeout #${i}`);
      resolve(n * 10);
    }, Math.random() * 3000 | 0);
  });
}));

console.log('result:', result);

Замените

{{bDay | date: format}}

на

{{ date | date : toggDate[pic.id] ? 'fullDate' : 'shortDate' }}

А свойство format можно удалить.

кнопки и слайды где то вообще не понятно где

css подключить забыли

const jsx = э-э-э, чё, это у вас тут фигурная скобка?

ошибка появилась из ниоткуда

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

Непонятно, чем мотивировано неиспользование v-for. Если использовать, будет гораздо проще добиться того, что вы хотите, например:

.hidden {
  opacity: 0;
}

data: () => ({
  items: [
    { text: '...', hidden: true },
    { text: '...', hidden: true },
    ...
  ],
}),
mounted() {
  this.items.forEach((n, i) => {
    setTimeout(() => n.hidden = false, 300 * (i + 1));
  });
},

<li v-for="{ text, hidden } in items" :class="{ hidden }">
  <a href="">{{ text }}</a>
</li>

Какого размера нужен массив и как создавать его элементы:

const length = 25;
const createItem = i => ({
  url: `photos/${i}.jpg`,
  // ещё какие-то свойства
});

Создаём:

const items = Array.from({ length }, (_, i) => createItem(i + 1));

// или

const items = [];
for (let i = 1; i <= length; i++) {
  items.push(createItem(i));
}

// или

const items = [];
while (items.length < length) {
  items[items.length] = createItem(-~items.length);
}

// или

const items = (function createItems(i) {
  return i > 0 ? [ ...createItems(i - 1), createItem(i) ] : [];
})(length);

И самое главное, мне нужно потом взять значение этих массивов.
descriptionImage.url - Как-то так

Не так.

Во-первых - не массивов, а свойств объектов, являющихся элементами массива. Не понимаете разницу между массивом и объектом, и что у объектов есть свойства?

Во-вторых - пропущено обращение к элементу массива: descriptionImage[индекс элемента].url.

не оборачиваются

Вообще-то, оборачиваются. Только после вы ничего с этими элементами не делаете. Ну и вместо wrap следует использовать wrapAll, чтобы у элементов оказался общий родитель, а не отдельный для каждого.

А как должно быть корректно? Просто забыли об этом рассказать, или решили что отвечающим догадаться труда не составит? Предположу, что вы стремились к чему-то вроде этого.