[리액트] reactstrap

강원지·2022년 8월 11일

reactstrap

Alert

import React, { Component } from 'react';
import { Alert, UncontrolledAlert } from 'reactstrap';

class R034_ReactstrapAlerts extends Component {
  render() {
    return (
      <div>
      <Alert color="light">
        Simple Alert [color : light]
      </Alert>
      <UncontrolledAlert color="warning">
        Uncontrolled Alert [color : warning]
      </UncontrolledAlert>
      </div>
    )
  }
}

export default R034_ReactstrapAlerts;

Badge

import React, { Component } from 'react';
import { Badge, Button } from 'reactstrap';

class R035_ReactstrapBadges extends Component {
  render() {
    return (
      <div>
        <h1>PRODUCT NAME <Badge color="secondary">hit</Badge></h1>
        <Button color="light" outline>
          Accessor <Badge color="dark">4</Badge>
        </Button>
        <Badge color="danger" pill>pill</Badge>
        <Badge href="http://example.com" color="light">GoLink</Badge>
      </div>
    )
  }
}

export default R035_ReactstrapBadges;

Breadcrubs

Button Dropdown

Button Group

Botton

0개의 댓글