Navigation To Bookmark On Next Page

[omgwalt]

I have a page that contains too much text on it, so I need to split it up into two pages.

The page is at ./index.html#/pageone

and the second page is at ./index.html#/pagetwo

I want a link on pageone to reference a bookmark on pagetwo, something like this:

./index.html#/pagetwo/#bookmark.

The above example doesn’t work. It just takes me to the top of pagetwo. How can I fix it to reference that bookmark on pagetwo when clicking from pageone?

[suleiman_as]

@omgwalt
You can do it like this:

<q-btn :to="{ path: '/pagetwo', hash: 'bookmark' }" />

<q-btn :to="{ name: 'pagetwo', hash: 'bookmark' }" />

for the scroll behavior, you may do what ever you want:

export default function(/* { store, ssrContext } */) {
  const Router = new VueRouter({
    //alway to top
    // scrollBehavior: () => ({ x: 0, y: 0 }),

    //to hash || to top
    scrollBehavior: function(to, from, savedPosition) {
      if (to.hash) {
        return { selector: to.hash };
      } else {
        return { x: 0, y: 0 };
      }
    },
    routes,

    // Leave these as they are and change in quasar.conf.js instead!
    // quasar.conf.js -> build -> vueRouterMode
    // quasar.conf.js -> build -> publicPath
    mode: process.env.VUE_ROUTER_MODE,
    base: process.env.VUE_ROUTER_BASE
  });

  return Router;
}

[omgwalt]

Thank you!