Scroll to id - Vue

For reference, I’m using a Vue+Cordova framework.

My layout had a left panel and a main scrolling content view. I’m trying to use the left panel as a Table of Contents with links to scroll to specific sections by I’d.

Ex $('.main-view .page-content').scrollTo($('#n2').offsetTop, 300) or even <f7-list-item href="#n2">link<f7-list-item>

I’ve tried countless variants and even just tried traditional anchor links right in the main content. Not sure what’s blocking this behavior.

I solved part of my own issue, mostly. Looks like Dom7 is registered as this.Dom7 in Vue not a global $$ or $.

I was running into conflict with jQuery registered as $ thus causing some confusion.

I am able to do something along the lines of: this.Dom7('.page-content').scrollTo(this.Dom7('#n2').offset().top-60, 300)

Still trying to figure out a way to do this with built-in f7 components.

1 Like