The $showPanel
method returns a PanelResult
object.
methods: { showPanel() { const panelResult = this.$showPanel({ component: 'your-component-name' }); } }
The PanelResult
object allows you to show and hide the panel programatically.
Just store the PanelResult
to your Vue component and use a method to call hide()
.
methods: { showPanel() { this.panelResult = this.$showPanel({ component: 'your-component-name' }); }, hidePanel() { this.panelResult.hide(); } }
You can also call show()
to re-show a panel.
methods: { showPanel() { if (this.panelResult) { this.panelResult.show(); return; } this.panelResult = this.$showPanel({ component: 'your-component-name' }); } }
The PanelResult
object also contains a promise
property, which is a Promise
.
You can use this promise to receive data from your panel component.
methods: {
showPanel() {
const panelResult = this.$showPanel({
component: 'your-component-name'
});
panelResult.promise
.then(result => {
//result is whatever you're panel component passes to this.$emit("closePanel", {})
});
}
}