bee-popover

bee-popconfirm

Browser Support

IE 9+ ✔	Chrome 31.0+ ✔	Firefox 31.0+ ✔	Opera 30.0+ ✔	Safari 7.0+ ✔

react bee-popconfirm component for tinper-bee

some description...

使用方法

const popoverLeft = (
  <Popconfirm id="popover-positioned-left" title="左侧弹出">
    您喜欢使用tinper-bee组件库吗？
  </Popconfirm>
);

class Demo extends Component {
    render () {
        return (
              <OverlayTrigger trigger="click" placement="left" overlay={popoverLeft}>
                <Button colors="primary">向左!</Button>
              </OverlayTrigger>
        )
    }
}

样式引入

• 可以使用link引入build目录下Popconfirm.css

<link rel="stylesheet" href="./node_modules/bee-popconfirm/build/Popconfirm.css">

• 可以在js中import样式

import "./node_modules/bee-popconfirm/src/Popconfirm.scss"
//或是
import "./node_modules/bee-popconfirm/build/Popconfirm.css"

API

参数	说明	类型	默认值
id	标示弹出层	string/number	-
title	卡片标题	string/ReactNode	-
content	卡片内容	string/ReactNode	-
placement	弹出位置	可选 top left right bottom topLeft topRight bottomLeft bottomRight leftTop leftBottom rightTop rightBottom	right
positionTop	弹出框向上偏移量	string/number	-
positionLeft	弹出框向左偏移量	string/number	-
container	容器	ReactNode/function	body
trigger	触发现实和隐藏的事件类型	click/hover/focus	hover
show	控制显示和隐藏	bool	-
defaultOverlayShown	默认显示的状态	bool	false
onHide	隐藏时的回调	function	-

开发调试

$ npm install -g bee-tools
$ git clone https://github.com/tinper-bee/bee-popconfirm
$ cd bee-popconfirm
$ npm install
$ npm run dev