[Vuejs]-Vue child component leave transition callback not working

0👍

see corrected demo

  1. Use v-show directive. See compare v-if vs f-show

    <parent v-show="showContainer"></parent>
    
  2. child elements need self-controller and binding with properties

  • add v-if="showChild" in <div class="Child"></div>

  • create props in child

    props: {
    showChild: {
    type: Boolean,
    default: true
    }
    },

  • binding props in parent

    <child :showChild="showChild"></child>
    

0👍

Pretty sure it’s not possible this way.
Even when using CSS transitions, the parent still need to control the child’s transition out.
We’d need a disappear prop on Transition component :p

Maybe you won’t love this solution but, in the parent’s outro, you can call this.$refs.child.outro(this.$refs.child.$el)

👤Renaud

Leave a comment