feat: [wish] q-slide-transition: add opened / closed event quasarframework#2051

Author: rstoenescu

dev/components/other/vue-transitions.vue

@@ -12,7 +12,7 @@
         <q-toggle v-model="visible" label="Visible image" />
       </p>
 
-      <q-slide-transition>
+      <q-slide-transition @show="log('show')" @hide="log('hide')">
         <p v-show="visible" style="margin: 0">
           <img
             class="responsive"
@@ -30,6 +30,11 @@ export default {
     return {
       visible: true
     }
+  },
+  methods: {
+    log (msg) {
+      console.log(msg)
+    }
   }
 }
 </script>

src/components/slide-transition/QSlideTransition.js

@@ -88,11 +88,17 @@ export default {
         appear: this.appear
       },
       on: {
-        enter (el, done) {
-          toggleSlide(el, true, done)
+        enter: (el, done) => {
+          toggleSlide(el, true, () => {
+            this.$emit('show')
+            done()
+          })
         },
-        leave (el, done) {
-          toggleSlide(el, false, done)
+        leave: (el, done) => {
+          toggleSlide(el, false, () => {
+            this.$emit('hide')
+            done()
+          })
         }
       }
     }, this.$slots.default)