el-popover弹出位置不对
时间: 2023-12-21 14:28:40 浏览: 28
el-popover弹出位置不对的原因可能是因为插件先计算了el-popover的位置,然后加载数据又改变了el-popover的宽高。解决方法可以通过模拟触发元素被点击,然后重新计算弹框的位置来解决问题。
代码示例:
```javascript
//模拟触发元素被点击:
this.$refs.show_popover.dispatchEvent(new MouseEvent('click'));
//重新计算弹框的位置:
this.$nextTick(() => {
this.$refs.room_info_popover.updatePopper();
});
```
相关问题
el-popover 弹出框hide方法
el-popover 弹出框的 hide 方法可以通过调用其实例对象的 `hide` 方法来实现隐藏。
首先,你需要获取到 el-popover 弹出框的实例对象。可以通过 `ref` 属性来标识 el-popover 弹出框,并在 JavaScript 中获取到该实例对象。
例如,给 el-popover 添加一个 ref 属性:
```html
<el-popover ref="myPopover">...</el-popover>
```
然后,在 JavaScript 中获取该实例对象:
```javascript
const popover = this.$refs.myPopover;
```
接下来,你可以调用 `hide` 方法来隐藏弹出框:
```javascript
popover.hide();
```
这样就可以隐藏 el-popover 弹出框了。记得在适当的时机调用该方法,比如点击某个按钮或者其他触发条件满足时。
el-popover弹出框在右边
你可以使用 `placement` 属性将 el-popover 弹出框放在右边。例如:
```html
<el-popover placement="right" title="Popover Title" trigger="click">
<p>Content of Popover</p>
<p>More Content</p>
</el-popover>
```
这样设置后,el-popover 弹出框将会在触发点击事件时从右边弹出。你还可以通过调整其他属性来自定义弹出框的样式和行为。