0xD34F

А зачем какой-то отдельный массив? Храните состояние чекбоксов в элементах workers.

При изменении состояния чекбоксов обновляйте workers:

inputChange = e => {
  const index = +e.target.dataset.index;

  this.setState({
    workers: this.state.workers.map((n, i) => i === index
      ? { ...n, checked: e.target.checked }
      : n
    ),
  });
}

<input
  type="checkbox"
  data-index={index}
  onChange={this.inputChange}
  checked={item.checked}
/>

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

const sum = this.state.workers.reduce((acc, n) => acc + (n.checked ? n.salary : 0), 0);

https://codesandbox.io/s/ol342z1znz

Вы добавляете скрываемому элементу класс, переключающий свойство display, одновременно с классом, который задаёт изменение прозрачности - поэтому пронаблюдать последнее вы не успеваете. Переключайте display после того, как анимация будет завершена - для этого можно подписаться на событие transitionend. Например.

Контекст потерялся. Ну и не надо пытаться достучаться до элемента через querySelector - он доступен как свойство target объекта события.

submitText = (e) => {
  this.setState({
    text: e.target.value,
  });
}

У вас created в methods лежит, так что это не хук жизненного цикла получается, а метод, автоматически он вызываться не будет.

Контекст потеряли, this при обработке ответа - вовсе не экземпляр vue.

Используйте стрелочные функции - замените function (response) { на (response) => {.

Или используйте bind:

axios(...).then(function(response) {
  this.info = response.data;
}.bind(this));

Или перед запросом сохраняйте контекст в отдельную переменную, и работайте в коллбеке с ней вместо this:

const that = this;
axios(...).then(function(response) {
  that.info = response.data;
});

Или вынесите код коллбека в отдельный метод - vue сам привяжет контекст:

methods: {
  processResponse({ data }) {
    this.info = data;
  },
},
mounted() {
  axios(...).then(this.processResponse);
},

Или используйте async-await:

async mounted() {
  try {
    this.info = (await axios(...)).data;
  } catch (e) {}
},

нигде

.banner h1 {
  margin-top: 0;
}

$found = null;

foreach ($arr as $item) {
  if (in_array($item['name'], $if_arr)) {
    $found = $item;
    break;
  }
}

if ($found) {
  // ...
}

О каком массиве идёт речь, через какой промежуток надо получать его элементы и что с ними делать:

const options = [
  [ 'hello, world!!', 'fuck the world', 'fuck everything' ],
  500,
  (elem => item => elem.textContent = item)
  (document.querySelector('.slide-words')),
];

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

function interval(arr, delay, callback) {
  let i = -1;

  return arr.length
    ? setInterval(() => callback(arr[i = -~i % arr.length]), delay)
    : null;
}


const intervalId = interval(...options);
// надо остановить, делаем так: clearInterval(intervalId);

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

function interval(arr, delay, callback) {
  let timeoutId = null;

  arr.length && (function next(i) {
    timeoutId = setTimeout(() => {
      callback(arr[i]);
      next((i + 1) % arr.length);
    }, delay);
  })(0);

  return () => clearTimeout(timeoutId);
}


const stop = interval.apply(null, options);
// надо остановить, делаем так: stop();

data = data.reduce({}){|acc, (k, v)| acc.update(v['child'] || {k => v})}

Потому что parseInt('') будет NaN.

При суммировании подставляйте 0 вместо пустых строк, замените parseInt($(this).val()) на parseInt($(this).val()) || 0.

https://jsfiddle.net/xw6acvnb/

Как достать кусок текста из элемента:

const getValue = el => el.textContent.match(/"(.*?)"/)[1];

// или

const getValue = ({ innerText: t }) =>
  JSON.parse(t.slice(t.indexOf('['), -~t.indexOf(']'))).shift();

Как обработать клики - можно обработчик назначить каждой кнопке индивидуально:

document.querySelectorAll('li button').forEach(function(n) {
  n.addEventListener('click', this);
}, e => console.log(getValue(e.target)));

Или делегировать обработку события общему предку:

document.querySelector('ul').addEventListener('click', e => {
  if (e.target.tagName === 'BUTTON') {
    console.log(getValue(e.target));
  }
});

вижу, что в строке 16 там идет запись в параметр binding

Где вы там такое увидели, непонятно. Вызов параметра-функции - это никакая не "запись в параметр".

{{:~root.вашеСвойство}}

v-for="i in количествоИтераций"

https://jsfiddle.net/pbLw3dr4/

Очевидно, с помощью одной строковой переменной задать цвет нескольких блоков затруднительно.

Пусть будет массив, элементы которого задают цвет отдельных блоков:

data: () => ({
  items: Array(10).fill(null),
  ...

<ul>
  <li v-for="(n, i) in items" :style="index < i || { color: n }">
    {{ i }}
  </li>
</ul>

Копипастить кнопки и методы для переключения цвета не очень здорово - что если цветов будет не два, а пять? Десять? Сорок? Сделаете сорок разных методов и вручную напишите разметку для сорока кнопок?

Метод оставьте один, а устанавливаемый цвет сделайте его параметром:

methods: {
  next(color) {
    const { index, items } = this;
    this.index = index === items.length - 1 ? 0 : index + 1;
    items.splice(this.index, 1, color);
  },
  ...

А доступные для назначения цвета складываете в массив, на основе которого создаются кнопки:

data: () => ({
  colors: [ 'red', 'lime', 'blue', 'orange', 'magenta', 'aqua', 'yellow' ],
  ...

<button v-for="c in colors" @click="next(c)">{{ c }}</button>

https://jsfiddle.net/wcjkft23/

headerObj.offsetTop

Бессмысленная операция. Этот headerObj - совсем не тот, что в iframe'е. Лучше при клике в списке получайте индекс кликнутого элемента, и берите в iframe'е заголовок с таким же индексом.

const frame = document.getElementsByTagName('iframe')[0];

Вот такого не надо. Используйте useRef - получаете ссылку на экземпляр своего редактора, у него там свойство document есть, нужного вам iframe'а.

UPD. https://codesandbox.io/s/j3oy0q1219

const getShowPaths = (obj, path = '') => Object
  .entries(obj || {})
  .filter(n => n[1].show)
  .reduce((acc, n) => {
    const p = path ? `${path}.child.${n[0]}` : n[0];
    return acc.concat(p, ...getShowPaths(n[1].child, p));
  }, []);


const result = getShowPaths(obj);