반응 의미 ui 헤더 메뉴

Question

헤더를 만들 때 semantic-ui-react을 사용하고 있습니다. 앱 컨테이너에

export default class Header extends Component { 
    render() { 
    return (
     <Menu stackable> 
     <Menu.Item name="search"> 
      <Search /> 
     </Menu.Item> 

     <Menu.Item name="username"> 
      <User username="user" /> 
     </Menu.Item> 

     <Menu.Item name="bell"> 
      <Bell /> 
     </Menu.Item> 
     <Menu.Menu position="right"> 
      <Menu.Item name="search"> 
      <img src={logo} /> 
      </Menu.Item> 
     </Menu.Menu> 
     </Menu> 
    ); 
    } 
} 

과 : 내가 여기에 대한 Menu 항목을 사용하고 내 코드입니다

return (
    <Container fluid > 
     <Header /> 
    </Container> 

하지만 난 볼 페이지의 렌더링 무엇은 목록 등이며, 그리고이 없습니다 모든 스타일과 문서 페이지의 예를 들어 보지 못했습니다 : Doc's 내가 놓친 것이 있습니까?

워드 프로세서

Answer 1

: 시맨틱 UI를 설치

은 구성 요소에 대한 자바 스크립트를 제공한다 반응한다. 또한 구성 요소의 스타일을 제공하기 위해 스타일 시트를 포함해야합니다

당신은 할 수 있습니다,

$ npm install semantic-ui-css --save 

설치 후 당신의 JS 파일에 포함 :

import 'semantic-ui-css/semantic.min.css';