Best approach - template or page and where best to put JS

I tend to use pages and load via AJAX from my main screen.
My routes looks like this:

path: ‘/about/’,
url: ‘./about.html’,
name: ‘about’,
// Buttons page
path: ‘/buttons/’,
componentUrl: ‘./buttons.html’,
name: ‘buttons’,
}, …

However, the about page, (loaded by url)
I can’t run any Javascript in a block

The Buttons page (loaded by componentUrl)
I can run code in

  1. Is there any difference in performance using $$(document)… approach as opposed to using ES6 style methods in return object? Which is preferred?
  2. If I want to run JS code, and add it to a specific page, without adding it to the root app init, do I have to use and componentUrl… will it not work in normal pages?


If you put <script> inside of usual page loaded by url it won’t work. If you need some page-specific JS logic then it is better to use componentUrl

Thanks. I thought that might be the case.

Any pros/cons, preferences to either:

$$(document).on(‘click’, ‘.button1’, function (e) {


return {
methods: {
test: function () {
var app = this.$app;

Why would you choose one over the other?

Second way is more organized and correct for router component. But you can do how you like more

Thank you for a great framework.