相关疑难解决方法(0)

从VueJS中的组件模板打开Vuetify对话框

我正在使用VueJS Vuetify框架,我需要从另一个模板打开一个对话框 - 它作为组件模板导入.单击App.vue中Menu按钮后,Modal应该打开.这是我的设置:

  • App.vue =带菜单按钮的导航模板
  • Modal.vue =模态模板,在main.js中作为全局导入

main.js

import Modal from './components/Modal.vue'
Vue.component('modal', Modal)
Run Code Online (Sandbox Code Playgroud)

Modal.vue模板:

<template>
  <v-layout row justify-center>
    <v-btn color="primary" dark @click.native.stop="dialog = true">Open Dialog</v-btn>
    <v-dialog v-model="dialog" max-width="290">
      <v-card>
        <v-card-title class="headline">Use Google's location service?</v-card-title>
        <v-card-text>Let Google help apps determine location. This means sending anonymous location data to Google, even when no apps are running.</v-card-text>
        <v-card-actions>
          <v-spacer></v-spacer>
          <v-btn color="green darken-1" flat="flat" @click.native="dialog = false">Disagree</v-btn>
          <v-btn color="green darken-1" flat="flat" @click.native="dialog = false">Agree</v-btn>
        </v-card-actions>
      </v-card> …
Run Code Online (Sandbox Code Playgroud)

javascript vue-component vuejs2 vuetify.js

26
推荐指数
4
解决办法
4万
查看次数

Vuetify 超出最大调用堆栈大小

我正在使用 Vuetify 对话框 这是我的代码

<v-dialog  max-width="390" persistent  v-model="dialog">
  <template v-slot:activator="{ on }">
    <v-btn icon v-if="el.items_count == 0" v-on="on" >
        <v-icon>
          mdi-plus
        </v-icon>
      </v-btn>
  </template>
  <v-card flat>
    <v-card-title>
      this is Son for {{el.title}}
    </v-card-title>
    <v-text-field class="d-block pa-2" v-model="name" outlined label="Name"></v-text-field>
    <v-card-actions>

      <v-btn @click="add" class="d-block">
        <span>Add</span>
      </v-btn>
      <v-btn @click="dialog=false" class="d-block">
        <span>Close</span>
      </v-btn>
    </v-card-actions>
  </v-card>
    </v-dialog>
Run Code Online (Sandbox Code Playgroud)

和这个对话框在循环内并在单击按钮后收到此错误

Uncaught RangeError: Maximum call stack size exceeded.
at VueComponent.onFocusin (VDialog.ts?d213:238)
at VueComponent.onFocusin (VDialog.ts?d213:238)
at VueComponent.onFocusin (VDialog.ts?d213:238)
at VueComponent.onFocusin (VDialog.ts?d213:238)
at VueComponent.onFocusin (VDialog.ts?d213:238)
at VueComponent.onFocusin (VDialog.ts?d213:238)
at …
Run Code Online (Sandbox Code Playgroud)

vue.js vuetify.js

8
推荐指数
3
解决办法
5623
查看次数

标签 统计

vuetify.js ×2

javascript ×1

vue-component ×1

vue.js ×1

vuejs2 ×1