Сергей Соколов

метод mounted() срабатывает только один раз, когда компонент размещается.

После добавления нового элемента mounted() не вызывается и таймер для добавленного не заводится.

Незачем делать по индивидуальному таймеру для каждого элемента. Сделайте один таймер на весь компонент, по его срабатыванию обновляйте все элементы:

Цели правильно понимаю?

1. Ограничить частоту обращений к backend - не более N в M секунд
   
2. Не потерять набранную корзину
   

Первый пункт решается учетом времени последних N обращений.
Второй - флагом "всё сохранено на бэкенде" – который ставится при изменении корзины и снимается после успешной синхронизации. При поднятом флаге не давайть так просто уходить со страницы через onBeforeUnload

<div v-bind:class="{ active: isActive }"></div>

Через метод меняйте значение свойства isActive, класс active добавится/уберется.

Подробнее (на англ.)

Это код компонента. В компоненте свойство data обязательно должно быть функцией, т.к. иначе одни и те же данные были бы у всех инстансов этого компонента.

Чтобы код заработал, надо еще его подключить и вставить этот компонент где-то внутри элемента, с которым работает "корневой" Vue.

В простом виде для корневого компонента можно оставить data как вы написали. Посмотрите пример v-for в документации.

Флаг isLoading пусть принимает значения либо false либо true (когда идёт загрузка).

Показывать/скрывать спиннер через v-if="isLoading"

v-for умеет по-всякому, в т.ч. в диапазоне:

<div>
  <span v-for="n in 10">{{ n }} </span>
</div>
<!-- получится 1 2 3 4 5 6 7 8 9 10 -->

Выходит, минимальный костыль это для Vue внутри «общего» элемента создавать ещё один div, который и скармливать как el во Vue.

appel.innerHTML = '<div></div>'; // дополнительный контейнер, его Vue заменит своей DOM
  instance = new Vue({
    el:'#app>div',
    template: '<p>I am {{ who }}!</p>',
    data: {who:"a Vue view"}
  });

Фиддл

this.$emit("getSomething", item, field) просто выстреливает событие асинхронно и ничего не возвращает.

В любом компоненте доступен корневой Vue через this.$root, хотя в документации настаивают, что лучше вместо этого перейти на vuex.

Можно хранить данные в this.$root.$data, как вариант. Писать их туда напрямую, или, более мягко, вызывать из компонента события на руте:

this.$root.$emit('formFilled', {name:"Ivan", job:"developer"})

В примере результат никак не зависит от значений param1 и param2. Поэтому при их изменении ничего не меняется.

Можно упростить всю логику. Убрать watch и created, оставить единственную функцию computed: resultAll, в которой и производить все вычисления. Примерно так: Fiddle.

var app = new Vue({
  el: '#app1',
  data: {
    param1: 3100,
    param2: 200,
  },
  
  computed: {
    resultAll: function() {
      var p1 = this.param1
         ,p2 = this.param2
      ;
      return {
      	one: p1 * 2,
        two: p2 * 3,
        three: p1 + p2
      };
    }
  }
});