# 弹出层 - Popover

# 预览及使用方法


<g-popover>
    <template slot="content">我在上面</template>
    <g-button>点击显示</g-button>
</g-popover>
<g-popover position="bottom">
    <template slot="content">我在下面</template>
    <g-button>点击显示</g-button>
</g-popover>
<g-popover position="left">
    <template slot="content">我在左边</template>
    <g-button>点击显示</g-button>
</g-popover>
<g-popover position="right">
    <template slot="content">我在右边</template>
    <g-button>点击显示</g-button>
</g-popover>
<g-popover trigger="hover">
    <template slot="content">我在上面</template>
    <g-button>鼠标悬浮显示内容</g-button>
</g-popover>
      

# 相关提示:

# 1、position

position 默认为 top ,可选择的参数为 top , left , right , bottom ,从而分别设置 popover 显示的方位。

# 2、trigger

trigger 默认显示方式为 click ,用于设置触发 popover 显示的事件,除此之外还支持鼠标的 hover 事件