naive-ui/demo/documentation/components/popover/zhCN/manualPosition.demo.md
07akioni 487001d697 build: add changelog to site, refactor loader based on suffix
.demo.md for component demo
.demo-entry.md for demo entry
.md for common docs
2020-08-19 23:30:04 +08:00

30 lines
580 B
Markdown

# 手动定位
点它
```html
<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>
```
```js
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
}
}
}
```