TabStrip Overview

The TabStrip displays a collection of tabs with associated content.

The tabs enable the user to switch between different views inside a single component.

The TabStrip wrapper for Vue is a client-side wrapper for the Kendo UI TabStrip widget.

Basic Usage

The following example demonstrates the TabStrip in action.

View Source
Edit In Stackblitz  
Change Theme:

Functionality and Features


The following example demonstrates basic TabStrip events. You can subscribe to all TabStrip events by the handler name.

<div id="vueapp" class="vue-app">
    <kendo-tabstrip @select="onSelect">
            <li class="k-state-active">
                New York
                <p>Rainy weather in Paris.</p>
                <p>Sunny weather in New York.</p>

new Vue({
        el: '#vueapp',
        methods: {
            onSelect: function(e) {
                console.log("Selected: " + $(e.item).find("> .k-link").text());

In this article

Not finding the help you need?