ReactJS 프로그래밍을 통해 MUI DataGrid의 모든 노드 확장 및 축소
<p>MUI ReactJS의 <code>DataGrid</code>에서 프로그래밍 방식으로 모든 행을 확장/축소하는 방법은 무엇입니까? </p>
<p><strong>무엇을 시도해 보셨나요? </strong> MUI 문서에 따라 <code>defaultGroupingExpansionDepth</code> 속성을 사용했습니다. </p>
<pre class="brush:php;toolbar:false;">export const EXPAND_ALL = -1;
수출 const COLLAPSE_ALL = 0;
...
const [expandedState, setExpandedState] = useState(COLLAPSE_ALL);
...
반환 <스택>
<스택 간격={2} 방향="행" m={1}>
<Button 변형={"contained"} onClick={() => setExpandedState(EXPAND_ALL)}>모두 확장</Button>
<Button 변형={"contained"} onClick={() => setExpandedState(COLLAPSE_ALL)}>모두 접기</Button>
</스택>
<DataGridPro
트리데이터
...
apiRef={dataGridApi}
defaultGroupingExpansionDepth={expandedState}
... />
</Stack></pre>
<p>문제는 이 버튼이 트리가 부분적으로 확장되지 않은 경우에만 작동한다는 것입니다. </p>
<p>트리 그리드를 부분적으로 확장하면 버튼이 더 이상 작동하지 않습니다. 트리 그리드의 현재 확장/축소 상태에 관계없이 이러한 버튼이 작동하도록 하려면 어떻게 해야 합니까? </p>