EasyUI Forum

General Category => EasyUI for Vue => Topic started by: don on April 28, 2022, 09:44:21 AM

Title: Panel Close Event
Post by: don on April 28, 2022, 09:44:21 AM

How can I add an event listener for a panel close event? I'm using the panel's 'closable' attribute and clicking on the ".panel-tool-close" button in the header to close the panel.

Title: Re: Panel Close Event
Post by: jarry on April 29, 2022, 04:47:39 PM

Please listen to the 'close' event. Make sure to upload to the newest version.

Code:

    <Panel title="Panel1" closable @close="onClose" style="width:800px;height:300px">
    </Panel>

Title: Re: Panel Close Event
Post by: don on May 02, 2022, 03:57:40 AM

I have updated to the latest version (1.2.43) and tested exactly as suggested, but still not triggering the close event. ???

Title: Re: Panel Close Event
Post by: jarry on May 03, 2022, 06:56:27 AM

Please refer to this code.

Code:

<template>
  <div>
    <Panel title="Panel1" closable @close="onClose" style="width:800px;height:300px">
    </Panel>
  </div>
</template>

<script>
export default {
  methods: {
    onClose(){
      console.log('Panel closed')
    }
  }
};
</script>

Title: Re: Panel Close Event
Post by: don on May 03, 2022, 09:29:46 AM

Success! As of version 1.2.44 the close event is now triggering. Thanks Jarry. :)