• Introduction
  • Getting Started
  • Vue 2 End of Support
  • Native Components
    • Animation
    • Buttons
    • Chartsupdated
    • Conversational UInew
    • Data Query
    • Data Tools
    • Date Inputs
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Form
    • Gauges
    • Grid
    • Icons
    • Indicators
    • Inputs
    • Labels
    • Layoutupdated
      • Overview
      • Getting Started
      • ActionSheetnew
      • AppBar
      • Avatar
      • BottomNavigation
      • Card
      • ContextMenu
      • Drawer
      • ExpansionPanelnew
      • GridLayoutnew
      • Menu
      • PanelBar
      • Splitter
      • StackLayoutnew
      • Stepper
      • TabStrip
      • TileLayoutupdated
      • Wizard
      • Globalization
      • API
    • ListBox
    • ListView
    • Notification
    • PDF Processing
    • Popup
    • Progress Bars
    • Scheduler
    • ScrollView
    • Tooltip
    • TreeList
    • TreeView
    • Upload
  • Wrapper Components
  • Sample Applications
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Changelog
  • FAQ
  • Troubleshooting
Components / Layout / API / PanelBarItemProps / 
New to Kendo UI for Vue? Start a free 30-day trial

PanelBarItemProps

Represents the props of the PanelBarItem component.

NameTypeDefaultDescription

animation?

boolean

Allows individual animation control over the child (see example). By default, it is controlled by the PanelBar component.

content?

any

Defines the custom rendering of the content of the PanelBarItem. Accepts a Vue component, a render function, or a slot name.

disabled?

boolean

Sets the disabled state of the PanelBarItem (see example).

expanded?

boolean

Sets the initial expanded state of the PanelBarItem (see example). Controlled by the PanelBar component.

focused?

boolean

Sets the initial focused state of the PanelBarItem. Controlled by the PanelBar component.

header?

any

Defines the custom rendering of the header of the PanelBarItem. Accepts a Vue component, a render function, or a slot name.

headerClassName?

string

The class name that is set to the PanelBarItem header.

icon?

string

Defines an icon that will be rendered next to the title (see example).

iconClass?

string

Defines an icon with a custom CSS class that will be rendered next to the title (see example).

id?

string | number

Allows the component to set the id property to each item. If not set, a default id is applied.

imageUrl?

string

Defines the location of the image that will be displayed next to the title (see example).

items?

any[]

Sets the subitems of the item.

selected?

boolean

Sets the initial selected state of the PanelBarItem. Controlled by the PanelBarItem component (see example).

svgIcon?

SVGIcon

Defines an SVGIcon to be rendered next to the title.

title?

any

Sets the title of the PanelBar item (see example).

uniquePrivateKey?

string | number

Used to identify the PanelBarItems inside the PanelBar (see example). Does not depend on the state of the PanelBarItem.

In this article

Not finding the help you need?

Contact Support