mirror of
https://github.com/tusen-ai/naive-ui.git
synced 2024-12-27 05:00:48 +08:00
29 lines
573 B
Markdown
29 lines
573 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
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
```
|