MDBStepper does not work when rendered inside inactive Tab


Topic: MDBStepper does not work when rendered inside inactive Tab

bernspe pro premium priority asked a year ago

Expected behavior MDBStepper should render inside MDBTabItem Actual behavior if MDBTabItem is set active at start, everything works fine, but if MDBStepper runs inside an inactive MDBTabItem rendering doesn't occur once it is activated. If Screen is resized, the content of MDBStepper appears. Resources (screenshots, code snippets etc.)


Bartosz Cylwik staff answered a year ago

Hi again! I managed to put a Stepper inside an inactive Tab component. I've added a v-for directive that mounts and unmounts the stepper when tab changes. That makes the Stepper to recalculate it's height and makes it visible.

Checkout my snippet here: https://mdbootstrap.com/snippets/vue/b-cylwik/5681204#js-tab-view


Bartosz Cylwik staff answered a year ago

Hi! Thanks for letting us know. We'll see what we can do about it. Best Regards!


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: MDB Vue
  • MDB Version: MDB5 4.1.0
  • Device: Desktop
  • Browser: Chrome
  • OS: MacOSX
  • Provided sample code: No
  • Provided link: No
Tags