CODEWITHSUNDEEP
vuejs2vuetify.js
Bill
Bill

Reputation: 540

vuetify: manually play persistent dialog refuse to close animation

When you click outside a persistent dialog, it will play a animation and dialog will not close, I would like to play this animation when form validation fail and dialog refuse to close

I cannot find any information at vuetify doc, would like to have some pointer to find this out, I am new to java framework and have no idea how I can drag into the source to find out any hint on this.

Upvotes: 0

Views: 108

Answers (1)

Anees Hameed
Anees Hameed

Reputation: 6554

UPDATED

Dialog has a method called animateClick, you can call the same.

CODEPEN

<div id="app">
  <v-app id="inspire">
   <v-container fill-height>
    <v-row>
      <v-col align=center>
        <v-btn color="primary" @click="dialog = true">Open</v-btn>
      <v-col>
    </v-row>
   </v-container>
   <v-dialog ref="dialog" v-model="dialog" width="400px">
     <v-card >
       <v-card-title
          class="headline grey lighten-2"
          primary-title
        >
          Privacy Policy
        </v-card-title>
       <v-card-text>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in 
        </v-card-text>
       <v-divider></v-divider>
       <v-card-action>
         <v-btn @click="doAnimation">Animate Me</v-btn>
       </v-card-action>
     </v-card>
   </v-dialog>
  </v-app>
</div>
<script>
  export default{
    ...
    methods: {
      methods:{
       doAnimation(){
          this.$refs.dialog.animateClick()
        }
      }
    }
  }
</script>

Upvotes: 1

Related Questions