0xD34F

data: () => ({
  options: [
    { value:  69, text:  'hello, world!!' },
    { value: 187, text:  'fuck the world' },
    { value: 666, text: 'fuck everything' },
  ],
  value: null,
}),
computed: {
  selectedText() {
    return (this.options.find(n => n.value === this.value) || {}).text || '';
  },
},

<select v-model="value">
  <option v-for="n in options" :value="n.value">{{ n.text }}</option>
</select>
<div>
  Текст выбранной опции: <span>{{ selectedText }}</span> 
</div>

$('.program-link img').css('transform', () => `rotate(${Math.random() * 10 - 5}deg)`);

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

Что, наверное, совсем неудивительно - не вижу, чтобы вы обновляли предыдущее значение после вычисления разницы. Оно у вас изначально нулевое, надо полагать - ну вот постоянно и вычисляете разницу с нулём.

А вообще, хранить предыдущее значение необходимости нет:

watch: {
  totalBuyQuantity(newVal, oldVal) {
    this.buyDiff = newVal - oldVal;
  },
},

пробовал использовать computed <...> если пользователь руками поменяет этот адрес, он все равно останется прежним

Добавьте сеттер:

email() {
  get() {
    return this.$store.state.user.email;
  },
  set(val) {
    // тут вызов мутации, которая поменяет значение в хранилище
  },
},

scrollIntoView

демо

Параметр, через который вы пытаетесь настраивать превью

1. Является отдельной штукой, а не частью slideConfig
2. Пишется с маленькой буквы

Т.е.: [previewConfig]="{ number: 10 }".

После изменения значения labels надо график обновить: myChart.update().

Сначала вычисляем максимальный размер вложенных массивов:

const length = Math.max(...players.map(n => n.holes.length));

// или

const length = players.reduce((max, { holes: { length: n } }) => max > n ? max : n, 0);

Дальше можно дополнить существующие массивы:

for (const { holes } of players) {
  holes.push(...Array.from(
    { length: length - holes.length },
    () => ({ score: '-' })
  ));
}

Или собрать новые:

const newPlayers = players.map(n => ({
  ...n,
  holes: Array.from({ length }, (_, i) => n.holes[i] || { score: '-' }),
}));

$('.select-list').change(function() {
  const selected = $(':checked', this)
    .parent()
    .get()
    .map(n => $(n).text().trim())
    .join(', ');

  $('.selected-name--filter').text(selected || 'Любой');
}).change();

или

const select = document.querySelector('.select-list');

select.addEventListener('change', function() {
  const selected = Array
    .from(this.querySelectorAll(':checked'), n => n.parentNode.textContent.trim())
    .join(', ');

  document.querySelector('.selected-name--filter').textContent = selected || 'Любой';
});

select.dispatchEvent(new Event('change'));

this.setState(({ clientData }) => ({
  clientData: {
    ...clientData,
    active: !clientData.active,
  },
}));

$('a').attr('title', function() {
  return $(this).text();
});

или

document.querySelectorAll('a').forEach(n => n.title = n.innerText);

или

for (const n of document.getElementsByTagName('a')) {
  n.setAttribute('title', n.textContent);
}

$('select').change(function() {
  $('button').prop('disabled', $(this).val() === '0');
});

или

document.querySelector('select').addEventListener('change', function() {
  document.querySelector('button').disabled = this.value === '0';
});

data: () => ({
  opened: null,
  blocks: [
    { id: 1, content: 'Я первый' },
    { id: 2, content: 'А я второй' },
    { id: 3, content: 'Третьим буду' },
  ],
}),

<a v-for="b in blocks" @click="opened = b">открыть {{ b.id }} блок</a>

<div v-if="opened" :class="`block-${opened.id}`">
  <a @click="opened = null">Скрыть блок</a>
  <div class="content">{{ opened.content }}</div>
</div>

например

function getTree(data) {
  let root = data.find(n => n.id === 0);
  root = { title: root.name.slice(1,-1), id: root.id };

  data.filter(n => n.id !== 0).forEach(item => {
    const node = item.name.slice(1, -1).split('/').reduce((parent, title) => {
      if (!parent.children) {
        Object.assign(parent, { children: [], isDirectory: true });
      }
      let child = parent.children.find(m => m.title === title);
      if (!child) {
        child = { title };
        parent.children.push(child);
      }
      return child;
    }, root);
    Object.assign(node, { id: item.id, isDirectory: !!node.isDirectory });
  });

  return root;
}

@click="product.quantity = Math.max(0, product.quantity - 1)"

Вместо computed свойства сделайте фильтр:

filters: {
  price: val => val.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, "$1 ").replace('.', ','),
},

Соответственно, в шаблоне будет:

td {{ product.price | price }}

UPD. Кстати, раз уж вы выводите цены - можно вместо плясок с регулярными выражениями форматировать значение средствами функции toLocaleString, она умеет работать с деньгами, будет как-то так:

price: val => val.toLocaleString('ru', {
  style: 'currency',
  currency: 'RUB',
}),

Вы инициализируете слайдер до того, как назначаете обработчик события init - естественно, он не срабатывает. Поменяйте соответствующий код местами, и всё будет OK.