DevExtreme React - Control the Behavior

By default, exactly one panel can be in the expanded state at one moment. To change this, switch the collapsible and multiple options to true.

App.js
  • import React from 'react';
  • import 'devextreme/dist/css/dx.common.css';
  • import 'devextreme/dist/css/dx.light.css';
  •  
  • import { Accordion } from 'devextreme-react/accordion';
  •  
  • class App extends React.Component {
  • render() {
  • return (
  • <Accordion
  • collapsible={true} {/* All panels may be collapsed */}
  • multiple={true}> {/* Multiple panels may be expanded */}
  • </Accordion>
  • );
  • }
  • }
  •  
  • export default App;
See Also