naive-ui/demo/documentation/components/popover/enUS/manualPosition.md
2019-12-03 18:36:21 +08:00

566 B

Manually Positioned

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