AragonAN DAO
Search…
Aragon Developers Documentation
🛠
Developers
General Tools
The Basics
Guides
aragonOS
aragonCLI
aragonPM
aragonAPI
aragonUI
Getting started
How to upgrade
BASE
ACTIONS
NAVIGATION
Tabs
Pagination
BackButton
Link
Header
STRUCTURE
DATA ENTRY
VISUALIZATION
FEEDBACK
OVERLAYS
ADVANCES
aragonDS
Aragon Connect
App Center
Product Tools
📃
GLOSSARY
Aragon Client
Powered By GitBook
Tabs
A simple tabs component.

Usage

import { useState } from 'react'
import { Tabs } from '@aragon/ui'
​
const App = () => {
const [selected, setSelected] = useState(0)
return (
<Tabs
items={['Orange', 'Pear', 'Cherry']}
selected={selected}
onChange={setSelected}
/>
)
}

Demonstration

Props

items (required)

  • Type: Array of React nodes
The items that are going to be displayed in every tab.

selected

  • Type: Number
  • Default: 0
The currently selected tab, using its index.

onChange

  • Type: Function
When a tab is selected, this function gets called with the index of the tab as a parameter.
Previous
NAVIGATION
Next
Pagination
Last modified 2mo ago
Copy link
On this page
Usage
Demonstration
Props