v-menu：在 nuxt 项目中推送路由时，激活器插槽中的 v-text-field 消失答案

【问题标题】：v-menu: v-text-field in activator slot disappears when pushing route in nuxt projectv-menu：在 nuxt 项目中推送路由时，激活器插槽中的 v-text-field 消失
【发布时间】：2021-05-12 02:04:06
【问题描述】：

在我的 nuxt 项目中，我使用 Vuetify。我从用户那里获取日期，当用户通过单击保存按钮更改页面时，v-text-field 在页面更改之前消失，然后转到下一页。这是因为路线改变，但我找不到这个问题的解决方案。

<v-menu v-model="menu"
            :close-on-content-click="false"
           transition="scale-transition"
           rounded
           nudge-bottom="60px"
           min-width="290px">

       <template v-slot:activator="{ on, attrs }">
           <v-text-field :value="formatDateText"
                         label="Birth Date"
                         v-bind="attrs"
                         v-on="on"
                         offset-y
                         hide-details>
           </v-text-field>
       </template>
       <v-date-picker no-title
                       v-model="date"
                       @change="dateChangeFormat(formatDate)"
              
       />
     </v-menu>

【问题讨论】：

标签： javascript reactjs vue.js vuetify.js nuxtjs

【解决方案1】：

我为这个问题找到了 2 个解决方案。第一个解决方案是使用

 features: {
    transitions: false
  },

在 nuxt.config.js 中

第二种解决方案：在 v-menu 中添加 ref。

   <v-menu v-model="menu"
            ref="menu"
            :close-on-content-click="false"
            transition="scale-transition"
            rounded
            nudge-bottom="60px"
            min-width="290px">

在脚本区；

   beforeDestroy() {
        this.$refs.menu.activatorNode = null;
    },

【讨论】：