<body>
<div class="app">
<div class="circle"></div>
</div>
<script>
new Vue({
el: `.app`,
data: {
circle: document.querySelector(`.circle`)
},
methods: {
move(e) {
this.circle.style.left = e.pageX + `px`;
this.circle.style.top = e.pageY + `px`;
}
},
created() {
document.addEventListener(`mousemove`, this.move);
}
});
</script>
</body>
data: { circle: document.querySelector(`.circle`) },
.app
Vue заменит элементами, которые создаст сам. Если хотите иметь доступ к ним, для этого есть специальный механизм. Т.е., добавляете атрибут ref элементу .circle
:<div class="circle" ref="circle"></div>
this.circle
на this.$refs.circle
:this.$refs.circle.style.left = `${e.pageX}px`;
this.$refs.circle.style.top = `${e.pageY}px`;