naive-ui/demo/documentation/components/popover/zhCN/manualPosition.md
2020-01-30 17:38:14 +08:00

573 B

手动定位

<div style="width: 200px; height: 200px; background-color: rgba(0, 128, 0, .5);" @click="handleClick"></div>
<n-popover trigger="manual" :show="showPopover" :x="x" :y="y" manually-positioned>
  厉害!
</n-popover>
export default {
  methods: {
    handleClick(e) {
      if (this.showPopover) {
        this.showPopover = false
      } else {
        this.showPopover = true
        this.x = e.clientX
        this.y = e.clientY
      }
    }
  },
  data () {
    return {
      showPopover: false,
      x: 0,
      y: 0
    }
  }
}