Vue+F7 expandable card inside swipeable tabs

Questions
1

Hi,
we are having some problems with the interactions between expandable cards and some other components.
Here’s the source code of the page in question: https://pastebin.com/w1vwGg6F .

We have an expandable card (with swipe-to-close set to true) inside some swipeable tabs.
When opened (expanded) fullscreen, the card still allows for the left/right swipe of the swipeable tabs.
Here’s a demo video: https://drive.google.com/open?id=1gbmNG6sQCyDs6bwrCkd_ek-aXOYPvsfW
Is it the expected behaviour?

Thanks a lot!

2

It is expected because you use Swiper, swiper has overflow: hidden on its container. Search the forum, there were some solutions here with examples

3 
observer: true, 
observeParents: true,
4

Hi,
can you clarify on how are we supposed to set those params? We are using the f7-tabs (Vue) with the swipeable attribute… we tried in any way we could think of, but not a single one worked:

<f7-tabs swipeable
:observer="true" :observer-parents="true" 
data-observer="true" data-observer-parents="true"
:params="{observer: true, observeParents: true,}"
:data-params="{observer: true, observeParents: true,}"
:swiper-params="{observer: true, observeParents: true,}"
:swiperParams="{observer: true, observeParents: true,}"
>

Thanks!

5

This params for Swiper, read swiper docs

6

Hello.
With the following code we were able to set those params, but we have a couple of problems.

this.$f7.swiper.get('#cont').params.observer = true;
this.$f7.swiper.get('#cont').params.observeParents = true;

First of all, these lines of code don’t work in the mounted event of the component: the $f7.swiper.get method returns undefined during the mounted event, while it returns a Swiper object if called manually via button click.
Secondly, and most importantly, those params don’t work. The problem still persists…
Should we just give up?