气泡组件

  • 通过getTarget返回当前点击元素,必需。
  • 可通过placement设置气泡的显示位置, 可选top、bottom、left、right。
  • 当设置的位置不足够放置气泡,以下顺序顺延(top->bottom->left->right, bottom->top->left->right, left->right->top->bottom, right->left->top->bottom)。
  • 可通过distance设置气泡到点击对象的位置。
  • 可通过clickCallback定义气泡显隐时额外的回调函数。
  • 可通过hideCallback手动调用隐藏popover。

示例:

 <Button phSize='lg' ref={(button)=>{this.button = button}}>按钮</Button>
 <Popover getTarget={()=>{return this.button}} placement='top'>
     <div className='ph-popover-text'>
         一条很长的很长的气泡提示语,为了占位存在的气泡提示语。一条很长的很长的气泡提示语,为了占位存在的气泡提示语。
     </div>
 </Popover>
 <Button phSize='lg' ref={(button)=>{this.button1 = button}}>按钮</Button>
 <Popover getTarget={()=>{return this.button1}} placement='right'>
     <ul className='ph-popover-list'>
         <li className='ph-popover-item'>未上线单店</li>
         <li className='ph-popover-item'>未上线连锁店</li>
     </ul>
 </Popover>

This module provides the following classes: