VueJS Components using scrollIntoView()
Actually you have to reference the element in the component. Something like this for example:
this.$refs.[ref name here].$el.scrollIntoView({ behavior: 'smooth' });
The problem is that scrollIntoView
is called before the tab is rendered on the page because renders are asynchronous. Essentially, when you call
this.activeTab = 'Solution Details';
Vue does not immediately render the page, it just queues a render. However immediately after that you tell Vue to look for the rendered element and scroll to it. It's not there yet.
I think my first stab at solving this would be to use $nextTick.
this.$nextTick(() => this.$refs.solutionDetails.showCurrent(command))
That should wait for the render that needs to happen to occur before you attempt to scroll into view.