Material-UI : material-ui tabbar (탭)의 탭에 배지 추가

Question

Material-UITabs 구성 요소와 5 개의 Tab 구성 요소가 하위로 있습니다. 탭에 Badge을 표시하고 싶습니다. 배지는 각 탭 아래에 읽지 않은 항목을 표시합니다.

두 가지 버전의 탭이 있습니다. 하나는 아이콘과 텍스트가있는 데스크톱 용이고 하나는 아이콘이있는 모바일 용입니다. 배지를 두 버전 모두에 올바르게 배치하려면 어떻게 배치 할 수 있습니까? 또한 탭이 선택되지 않은 경우에도 배지가 표시되어야합니다 (배지를 하위 탭으로 설정하면 탭이 선택되지 않은 경우 숨겨집니다).

Answer 1

탭 구성 요소의 아이콘 또는 레이블 속성에 배지 구성 요소를 넣을 수 있습니다. 그냥 GitHub의 내 REPO을 확인 - 당신은 이런 식으로 작업을 수행 할 수 있습니다>

Answer 2

https://github.com/adhed/todo-app :

는

<Tab label={<Badge badgeContent={this.state.messageCount} color="primary"> 
    Messages 
</Badge>} value="/messages" />