Nikita Velko

В вашем случае вы теряете this, который равен инстансу компонента. Чтоб "не потерять" его, используйте стрелочную функцию.
Из документации:

Стрелочные функции не создают собственный контекст this, а используют значение this окружающего контекста.

computed: {
  incomingActive() {
    this.messages.forEach((message) => {
      alert('user_name is: ' + this.user);
      /* ... */
      return incomingActive;
    });
  },
},

Так, ну во-первых, если у вас this.options.series = null, то сам чарт тут не причем. Получается у вас где-то не записывается значение в пропс или в каком-то другом месте ошибка (что сложно понять, ибо вы не привели пример).
Во-вторых, я правильно понимаю, что вы прокидываете серии в чарт через пропсы, а потом в самом компоненте чарта через this.$parent хотите поменять эти самые пропсы, чтобы они обновились и прокинулись опять же в этот компонент? О_о Вам не кажется, что вы делаете что-то не так?
Ну и в-третьих, мой вам совет: при работе с highchart'ом в vue лучше делайте все сразу внутри компонента графика. Плюсы такого подхода: никаких вотчеров, прямой доступ к инстансу графика, не будет несоответствий между сериями в пропсах и в самом чарте (ибо далеко не всегда this.options.series[0] будет равен instance.series[0]). Я сам сначала все в график кидал через пропсы, чтоб компонент типа универсальный был. В итоге когда функционал вырос в несколько раз, все это стало очень сложно хендлить, плюс пошли просадки по памяти.
Ну и создайте пример хоть на том же http://jsfiddle.net, чтоб можно было вам помочь на деле.

Зачем вообще делать подобный геттер, который возвращает просто стэйт из сторы?
Если тоже самое вы можете получить через:

...mapState({
  news: state => state.news,
});

или this.$store.state.news

UPD: Вообще, правильней будет создать экшен в этой же сторе, который будет фетчить данные и заполнять массив. Ну и используйте async/await, например. Типа вот так:

const actions = {
  async fetchNews({ commit }) {
    // Стреляете запрос в нужный эндпоинт
    const { data } = await axios.get('http://your.api.endpoint');
    
    if (data.result) {
      // Записываете новости в стору с помощью мутации
      commit(SET_NEWS, data.data);
    } else {
      // Обрабатываете ошибку, если не удалось получить новости
    }
    
    return data;
  },
};

Ну а в самом компоненте получаете стэйт сторы, как я описывал выше. Ну и если нужно, рендерите блок с новостями через v-if="news.length > 0".

При нажатии на "добавить" увеличиваете инкремент количества форм на 1.
Через v-for="i in formCounter" выводите блоки с этими тремя инпутами и кнопкой.
Атрибуты у инпутов прописываете типа :name="`address-${i}`"

UPD: Живой пример

1. Включаешь devtools хрома.
2.
3.
4. Включаешь PerfectPixel и накладываешь макет.

Как по мне, у Vue самый низкий порог вхождения среди фреймворков.
Но если вы хотите быстрее найти работу и на нормальные деньги, то учите React. По реакту сейчас больше всего вакансий на рынке.

Пример решения с localStorage
Пока писал пример на фидле, товарищ imdeveloper опередил меня. :)
Но он советует вам правильно, лучше использовать localStorage.
Только имейте в виду, что в safari в инкогнито режиме localStorage не работает. Поэтому там при обновлении странички пользователь будет каждый раз видеть прелоадер.

this.newDeal = Object.assign({}, this.newDealDefaultState);

Документация.
Дело в том, что объекты передаются по ссылке, они никогда не копируются. Поэтому когда вы напрямую присваивали один объект к другому, то меняя значение в первом объекте, оно менялось и во втором, и наоборот.

transform-origin: center;

Документация.

methods: {
  toggle() {
    this.isActive = !this.isActive;
  }
}

Поменяйте стрелочную функцию toggle: () => { на метод toggle() { и тогда все заработает.

P.S. Откуда вы все вообще решили, что в методах компонента нужно писать стрелочные функции? :)
Просто вы не первый с такой проблемой. Ощущение, будто все насмотрелись уроков по ES6 и стали бездумно писать стрелочные функции там, где они вовсе не нужны.

Обычный хороший подход, даже правильный я бы сказал. Сам давно использую. И это действительно удобно, что можно в одном месте просмотреть все стили элемента по всем брейкпоинтам. В чем вопрос только непонятно. :)
Особенно удобно в сочетании с бутстрапом:

.logo {
  width: 198px;
  height: 122px;

  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;

  @include media-breakpoint-down(sm) {
    display: none;
  }
}

Просто исправьте target на currentTarget.
e.currentTarget.parentNode.id
Пример.

methods: {
  logout() {
    localStorage.removeItem('token');
    this.$store.commit('changeUserData', {});
    this.$store.commit('changeAuth', false);
  }
}

Если не заметили, что изменилось, то мы убрали стрелочную функцию и заменили ее на метод (короткий синтаксис es6). И собственно, после этой замены контекст this не будет теряться.
Было:
logout: () => {
Стало:
logout() {

Из документации:

Стрелочные функции не создают собственный контекст this, а используют значение this окружающего контекста.

Если у вас этот компонент отображается практически на всех страницах, то лучше храните список просмотренных товаров в Vuex.
И получается у вас будет примерно такая схема:

1. Пользователь зашел на сайт (не важно, впервые или нет), получаете просмотренные товары из localStorage и результат записываете в state;
   
2. При клике добавляете товар в state и обновляете его в localStorage.
   

В сам компонент данные вы передаете именно из стэйта, а не из localStorage, именно это и гарантирует вам реактивность данных.
И проверку localStorage вы будете делать всего один раз при загрузке, допустим, корневого компонента.

Попробуйте так:

{
  test: /\.vue$/,
  loader: 'vue-loader',
},
{
  test: /\.scss$/,
  loaders: [ "style-loader", "css-loader", "sass-loader" ]
},

И потом импорт стилей в компонент:

<style lang="scss">
  @import "./main";
</style>

Мой совет, используйте vue-cli, если вы ещё не.

Вы вообще понимаете, что если ваш сайт будут смотреть с самого обычного iPad, то достаточно будет его перевернуть в портретный режим и все, ваш сайт сломается?
Делать Vue.use() в зависимости от ширины экрана — это костыль. Подключать плагин вы должны в любом случае, а уже потом управлять его инициализацией и разрушением инстанса в какой-нибудь отдельной функции, которую вы подвяжете на resize эвент.
P.S. Ширина экрана, если что, window.innerWidth.

Я бы тут уже не стал городить всю логику в обработчик события.
А просто бы сделал метод sendMessage(), внутри которого бы проверял пол юзера и совершал нужные действия. Но тут уже вам надо будет подумать, где и как вы будете хранить пол юзера.

<textarea  v-on:keypress.enter.prevent="input.length && sendMessage()" id="chat_msg" placeholder="" v-model="input"></textarea>

methods: {
  sendMessage() {
    if (this.data.isMale) {
      // do something for men
    } else {
      // do something for women
    }
  },
},