对话转换完成后的回调 [英] Callback after dialog transition has finished

问题描述

Vuetify 有一些很好的内置过渡.但是如何在默认对话框缩放动画完成后调用方法?

Vuetify has some nice built-in transitions. But how can I call a method when the default dialog scale animation has finished?

https://codepen.io/anon/pen/qKNNLw

<v-dialog v-model="dialog" persistent max-width="200">
  <v-btn slot="activator">Open</v-btn>
  <v-card>
    <v-card-text>Thank you!</v-card-text>
    <v-card-actions>
      <v-spacer></v-spacer>
      <v-btn flat @click.native="dialog = false">Close</v-btn>
    </v-card-actions>
  </v-card>
</v-dialog>

Vuejs 在这里描述了一些 Javascript 回调:https://vuejs.org/v2/guide/transitions.html#JavaScript-Hooks可以以某种方式使用它们吗?

Vuejs describes some Javascript callbacks here: https://vuejs.org/v2/guide/transitions.html#JavaScript-Hooks Is it possible to use them somehow?

我的第一个想法是将对话框转换属性设置为 false 并用自定义转换包装它，但这似乎不起作用(禁用转换有效但添加我自己的没有)，可能是由于到 Vuetify 生成的底层结构.

My first idea was to set the dialog transition attribute to false and wrap it with a custom transition but this does not seem to work (disabling transition works but adding my own did not), maybe due to the underlying structure generated by Vuetify.

背景:我在对话框中渲染了一张谷歌地图，在达到全尺寸后需要调整大小.

Background: I render a Google map inside the dialog that needs to resize after reaching full size.

推荐答案

这个问题正在 Vuetify 的 v1.2.x 里程碑中处理:这里是问题

This issue is being treated in v1.2.x milestone of Vuetify : Heres the issue

您也可以考虑使用适当的 vuejs 钩子重新创建模态包装它.

You may consider recreating the modal wrapping it with the proper vuejs hooks as well.

这篇关于对话转换完成后的回调的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！