React-Bootstrap

[Wscats]

React-bootstrap官方文档

安装

npm install --save react react-dom
npm install --save react-bootstrap

引入样式

在主页引入CSS样式

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap-theme.min.css">

使用组件

import Button from 'react-bootstrap/lib/Button';
//或者
import { Button } from 'react-bootstrap';//推荐这种

比如我需要使用按钮的这几个组件

//引入ButtonGroup和Button组件
import {ButtonGroup,Button} from 'react-bootstrap';
//使用ButtonGroup和Button组件
const About = () => (
  <div>
    <h2>关于</h2>
    <ButtonGroup vertical block>
      <Button>Full width button</Button>
      <Button>Full width button</Button>
    </ButtonGroup>
  </div>
)

组件文档

查看其它组件