get_app Download

# Tabs

Tabs are very easy to implement

# Default

To implement a tabs, use the vs-tabs component. It must include vs-tab child components that represent each tab.

TIP

For the title of each tab the vs-tab property is implemented in thevs-tab component.

    # Color

    You can change the color of the component with the property color, the parameter allows the main colors and HEX or RGB

    WARNING

    Only RGB and HEX colors are supported.

      # Alignments

      Change the alignment of the buttons with the property alignments. The allowed values ​​are:

      • center
      • right
      • fixed

      Default

        Center

          Right

            Fixed

              # Position

              You can change the position of the menu with the property position that as a value you can have: top, right,bottom, left.

                # Icons

                You can add a left icon inside each tab with the property icon that has the same values as the icon component.

                  Edit this page

                  API #

                  Name Type Parameters Description default
                  vs-tabs Component Component that contains the children vs-tab.
                  v-model bind Link active tab index.
                  value Number, String Index of active tab. 0
                  position String top, left, bottom, right Tabs menu position.
                  color String RGB, HEX Color of the tabs component.
                  alignment String left (default), right, center, fixed Change the alignment of the tabs buttons. top
                  vs-tab Component component that wraps everything inside.
                  label String Text on the tab button.
                  icon String Same as `vs-icon` component. Add a left icon inside the tabs component.
                  v-on:click-tag Callback tab This function is executed by clicking on the tag.
                  tag Icon material icons Determine the icon inside the tag.
                  tagColor Colors Default Colors RGB, HEX Determine the color of the icon inside the tag.

                  Textarea keyboard_arrow_right