Views Basics

The Kendo UI for Vue Native Scheduler accepts a collection of Scheduler views as children but renders only the currently active view.

The Scheduler Package is part of Kendo UI for Vue, a professional grade UI library with 90+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.

View Types

Currently, the Scheduler component supports the following built-in views:

Getting Started

To render the desired views, import them from the @progress/kendo-vue-scheduler package.

import { Scheduler } from '@progress/kendo-vue-scheduler';

To specify the available views and set their configuration options, use the views property of the Scheduler component.

<Scheduler
    :data-items="sampleData"
    :default-date="displayDate"
    :views="views"
>
</Scheduler>

The following example demonstrates how to render the Day, Week, and Month Scheduler views.

Example
View Source
Change Theme:

Setting the Default View

To set the initially selected view, set the defaultView property to the name of the desired view.

Example
View Source
Change Theme:

Controlling the Selected View

To control the view selection, provide a pair of the view and onViewChange properties. Providing only the view property will render the Scheduler in a read-only view state.

The following example demonstrates how to control the view state based on an external source.

Example
View Source
Change Theme: