List.AccordionGroup allows to control a group of List Accordions. id prop for List.Accordion is required in order for group to work. List.AccordionGroup can be a controlled or uncontrolled component. The example shows the uncontrolled version. At most one Accordion can be expanded at a given time.


import * as React from 'react';
import { View, Text } from 'react-native';
import { List } from 'react-native-paper';

const MyComponent = () => (
    <List.Accordion title="Accordion 1" id="1">
      <List.Item title="Item 1" />
    <List.Accordion title="Accordion 2" id="2">
      <List.Item title="Item 2" />
        List.Accordion can be wrapped because implementation uses React.Context.
      <List.Accordion title="Accordion 3" id="3">
        <List.Item title="Item 3" />

export default MyComponent;


Type: (expandedId: string | number) => void

Function to execute on selection change.

Type: string | number

Id of the currently expanded list accordion

children (required)
Type: React.ReactNode

React elements containing list accordions

Edit this page