[Vuejs]-How to put normal Javascript into VueJS

by

2👍

You can put regular javascript in the script tag of your Vue component. It will execute just the same way a regular app.js file would execute.

👤Babakar Diop

1👍

Since you’re trying to learn Vue I’d suggest you look into how to achieve your desired functionality with Vues own toolset instead of using native JS event handlers, document selects etc.

You can easily add event listeners for most common events with the v-on: directive (or @ for short):

<button class="accordion" @click="myClickHandler">Section 1</button>

You can refer to other elements via the ref property which is then available in the Vue component under this.$refs:

<div class="panel" ref="myPanel">...

and in your myClickHandler method:

methods: {
  myClickHandler() {
    let panel = this.$refs.myPanel
    ... do stuff ....
  }
}

This would be “the Vue way” of tackling your problem – which once you get used to it is really awesome and simple compared to native JS dom selections, eventlisteners etc.

I’d suggest you look more into how to achieve this via Vues tools instead of trying to force native JS and foregoing all of Vues simplicity.

👤TommyF

Leave a comment