Сергей delphinpro

Правильно ли будет, если в методе addNewElement() я буду использовать стандартные методы работы с DOM-деревом?

Конечно нет.

Почему бы вам не хранить данные компонентов в data? И соответственно выводить их циклом. Добавление компонента будет сводится к добавлению элемента в список.

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

Примесь:

export default Vue.extend({
  methods: {
    hello: function () {
      console.log('test')
    }
  }
})

Еще у вас экспортируется переменная login, а импортируете вы Login.
Проблема скорее всего здесь. Отсюда и undefined.

Дополнение к ответу 0xD34F :
Зависимое переключение https://jsfiddle.net/ygbs1w79/1/

import Vue from 'vue';

// далее используем Vue в этом файле.

Надеюсь сборка у вас настроена.

Это не Vue =)
Это Ecmascript (javascript) по версии 2015 (es6)
Да, это стандарт языка, но браузеры его не поддерживают еще (не весь новый стандарт, я сейчас об импортах говорю). Поэтому при использовании нативных модулей нужно собирать их каким-либо бандлером. Например вебпаком.

Про трансляцию вы правильно понимаете. Только не в "нативный js" (это и так уже нативный js), а в js поддерживаемого браузерами стандарта - ES5