Omissions in QTabs component



  • The QTabs component is quite useful, but in my opinion it has some omissions:

    • It’s not redrawn automatically when a QTab item is inserted or removed – especially the navigation arrows visibility doesn’t change. I kinda solved this one by using a ready flag that gets updated when a new item is inserted, but it would be easier if the component did it already.
    • When inserted, new tabs that go past the current width are not scrolled into view. Apparently there are not events for doing this.
    • The mouse scroll wheel doesn’t do anything. Capturing the wheel events and sending clicks to the arrows didn’t work for me:
    wheel_scroll: function(event)
    {
      let arrows = this.$el.getElementsByClassName('q-tabs__arrow');
      let evt = document.createEvent("MouseEvents");
      evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
      // Here I chose one arrow for testing, but nothing happened:
      arrows[1].dispatchEvent(evt);
    }
    
    • It would be nice if users were able to drag individual tabs to change their order.

    Would exposing some extra events and properties allow these actions? I don’t know. Any help is appreciated. Thanks!


Log in to reply