Receiving an Error when using <f7-toolbar tabbar scrollable> but <f7-toolbar tabbar> works perfect

I am using “framework7”: “^2.1.2” and “framework7-vue”: “^2.1.2”
I am receiving the following error when using “” if I use “” it gives me no error

        <f7-toolbar tabbar scrollable>
            <f7-link tab-link="#tab1">Tab1</f7-link

vue.common.js:593 [Vue warn]: Error in mounted hook: “TypeError: Cannot read property ‘offsetWidth’ of undefined”

found in


at H:\AndroidApp\vsapp\src\assets\vue\pages\home.vue

at H:\AndroidApp\vsapp\src\main.vue

warn @ vue.common.js:593
logError @ vue.common.js:1737
globalHandleError @ vue.common.js:1732
handleError @ vue.common.js:1721
callHook @ vue.common.js:2923
insert @ vue.common.js:4158
invokeInsertHook @ vue.common.js:5960
patch @ vue.common.js:6179
Vue._update @ vue.common.js:2670
updateComponent @ vue.common.js:2788
get @ vue.common.js:3142
run @ vue.common.js:3219
flushSchedulerQueue @ vue.common.js:2981
(anonymous) @ vue.common.js:1837
flushCallbacks @ vue.common.js:1758
Promise.then (async)
microTimerFunc @ vue.common.js:1806
nextTick @ vue.common.js:1850
queueWatcher @ vue.common.js:3068
update @ vue.common.js:3209
notify @ vue.common.js:699
mutator @ vue.common.js:846
pageComponentLoader @ framework7-vue.esm.bundle.js:156
load @ framework7.esm.bundle.js:235
(anonymous) @ framework7.esm.bundle.js:236
navigate @ framework7.esm.bundle.js:236
init @ framework7.esm.bundle.js:338
init @ framework7.esm.bundle.js:356
View @ framework7.esm.bundle.js:354
create @ framework7.esm.bundle.js:379
onF7Ready @ framework7-vue.esm.bundle.js:5162
(anonymous) @ framework7-vue.esm.bundle.js:5429
Vue.$emit @ vue.common.js:2538
initFramework7 @ framework7-vue.esm.bundle.js:5252
mounted @ framework7-vue.esm.bundle.js:5423
callHook @ vue.common.js:2921
mountComponent @ vue.common.js:2802
Vue.$mount @ vue.common.js:8540
Vue.$mount @ vue.common.js:10939
Vue._init @ vue.common.js:4640
Vue @ vue.common.js:4729
(anonymous) @ main.js:82
./src/main.js @ c645b757564f834243cd.main.js:3783
webpack_require @ c645b757564f834243cd.main.js:679
fn @ c645b757564f834243cd.main.js:89
(anonymous) @ client:3
0 @ c645b757564f834243cd.main.js:3833
webpack_require @ c645b757564f834243cd.main.js:679
(anonymous) @ c645b757564f834243cd.main.js:725
(anonymous) @ c645b757564f834243cd.main.js:728
vue.common.js:1741 TypeError: Cannot read property ‘offsetWidth’ of undefined
at Framework7.setHighlight (framework7.esm.bundle.js:387)
at VueComponent.onF7Ready (framework7-vue.esm.bundle.js:5048)
at VueComponent.mounted (framework7-vue.esm.bundle.js:5427)
at callHook (vue.common.js:2921)
at Object.insert (vue.common.js:4158)
at invokeInsertHook (vue.common.js:5960)
at VueComponent.patch [as patch] (vue.common.js:6179)
at VueComponent.Vue._update (vue.common.js:2670)
at VueComponent.updateComponent (vue.common.js:2788)
at Watcher.get (vue.common.js:3142)

It was already fixed in main repo so the fix will be in next update

After updating to v 2.2.0 it is no longer thowing error, but still it is not working as expected.

There must be a tab link with tab-link-active prop