material-ui 1.0의 목록에 링크를 추가하는 방법은 무엇입니까?

Question

온 클릭 애니메이션 다음 놨합니다 (을 ListItem가 빨간색으로 변합니다) :

<List> 
    <a href="https://www.google.com"> 
    <ListItem button> 
     <ListItemText primary="Google" /> 
    </ListItem> 
    </a> 
</List> 

을 ListItem 내부 링크를 추가하는 동안 만 ListItemText 내가 원하는 바가 아니다, 클릭하면 전환 작업을합니다. 링크를 추가하는 올바른 방법은 무엇입니까?

Answer 1

이 작업을 수행하는 가장 쉬운 방법은 component 소품 사용하여 ListItem에게 링크를 만드는 것입니다 :

<List> 
    <ListItem button component="a" href="https://www.google.com"> 
    <ListItemText primary="Google" /> 
    </ListItem> 
</List> 

그 방법의 ListItem가 원하는 곳으로 연결하는 앵커 태그됩니다 만, 여전히를받을 시각적 인 변화가 없도록 적절한 스타일링.

component 소품의 동작은 here입니다. 소품 문서의 마지막 줄에 지정된대로 href 소품이 자동으로 앵커 태그에 전달됩니다 참고 : 공급

다른 속성은 루트 요소로 확산 될 것이다.

Answer 2

"반응 - 라우터 DOM"를 함께 사용

예이 섹션에 기반

import { Link } from "react-router-dom"; 
<ListItem button component={Link} to="/design"> 

: docs