Vue.jsがうまくいきません

vueと生のJSを使ってクリックすると内容が変化するようにしたかったのですが、うまくいきません。

app = Vue$3 {_uid: 5, _isVue: true, $options: Object, _renderProxy: Proxy, _self: Vue$3…}

と出てしまいますがこれはエラーでしょうか？

vueは生の関数は使えないが文法は使えると聞いているのですが、イベントリスナーやgetelementは使えないのでしょうか？

var changeBtn = document.getElementById('changeBtn');

changeBtn.addEventListener('click', function() {

var app = new Vue({
el: '#headding',
data: {
headding: '当社のダミー商品2つめを紹介します。'
}
});

var app = new Vue({
el: '#description1',
data: {
description1: '当社のダミー商品2つめを紹介します。当社のダミー商品2つめを紹介します。当社のダミー商品2つめを紹介します。当社のダミー商品2つめを紹介します。当社のダミー商品2つめを紹介します。当社のダミー商品2つめを紹介します。当社のダミー商品2つめを紹介します。'
}
});

var app = new Vue({
el: '#description2',
data: {
description2: '当社のダミー商品2つめを紹介します。当社のダミー商品2つめを紹介します。当社のダミー商品2つめを紹介します。当社のダミー商品2つめを紹介します。当社のダミー商品2つめを紹介します。当社のダミー商品2つめを紹介します。当社のダミー商品2つめを紹介します。'
}
});
});

初心者なので、初心者でもわかるように教えていただければ幸いです。