小编Umb*_*ent的帖子

正确使用 click:outside 和 vuetify 对话框

我有一个 v-dialog,我用它在需要时弹出日期选择器。为了展示它,我用 v-model 绑定了一个值。我使用 click:outside 事件来触发函数,一旦在外部单击,该函数就应该关闭它,这样我就可以再次触发它(如果我单击外部,对话框将被关闭,但该值保持为“true”,所以我可以“不要多次显示)。一定是我做错了什么。

这是我的对话框:

<template>
  <v-dialog
    v-model="value"
    @click:outside="closeDialog"
  >
    <v-date-picker
      v-model="date"
    />
    <v-divider/>
    <div>fermer</div>
  </v-dialog>
</template>

<script>
  export default {
    name: 'DatePickerDialog',
    props: ['value'],
    data() {
      return {
        colors,
        date: null,
      }
    },
    methods: {
      closeDialog() {
        this.value = false;
      }
    }
  }
</script>
Run Code Online (Sandbox Code Playgroud)

它的名字就这么简单:

<template>
  <div>
    <v-btn @click="inflateDatePicker">inflate date picker</v-btn>
    <date-picker-dialog v-model="showDatePicker"/>
  </div>
</template>

<script>
import DatePickerDialog from '../../../../views/components/DatePickerDialog';

export default{
  name: "SimpleTest",
  components: {
    DatePickerDialog
  },
  data() {
    return {
      showDatePicker: false,
    };
  },
  methods:{ …
Run Code Online (Sandbox Code Playgroud)

javascript vuejs2 vuetify.js

12
推荐指数
1
解决办法
2万
查看次数

Firebase Cloud Functions 可调用函数是否强制执行最终用户身份验证?

我想知道 Firebase Cloud Functions 本身是否具有可调用函数,例如:

exports.myCallableFunction = functions.https.onCall((data, context) => { 
  //... 
});
Run Code Online (Sandbox Code Playgroud)

本身是安全的,或者如果我需要在其中实现一些代码以确保只有经过身份验证的用户调用它们才能从中获取某些内容。根据我的理解,它是通过 API 端点调用的,所以我有点担心每个人都能够调用它。

如果需要实现某些逻辑,什么逻辑可以确保它是安全的?

javascript firebase-authentication google-cloud-functions

5
推荐指数
1
解决办法
1558
查看次数

覆盖 vuetify 对话框的溢出属性

简单的问题:我想要一个浮动操作按钮位于对话框的右上角,溢出,因此它与对话框有一点偏移。v-dialog 有“overflow-y:hidden”,无论我如何尝试,我都无法覆盖它。

<v-dialog max-width="450">
  <div style="width: 200px; heigth: 200px;" >
    <v-btn fab absolute top right>
      <v-icon>
        mdi-close
      </v-icon>
    </v-btn>
  </div>
</v-dialog>
Run Code Online (Sandbox Code Playgroud)

我尝试将一些样式与 !important 一起使用:

.show-overflow {
  overflow: visible !important;
}
Run Code Online (Sandbox Code Playgroud)

我尝试直接使用 'style="overflow:visible"' 中的样式

如果我使用 Chrome 的开发工具关闭 v-dialog 中的溢出:隐藏,我会得到我想要的确切结果,但我没有找到任何方法。

有人有解决办法吗?

css vue.js vuetify.js

2
推荐指数
1
解决办法
3092
查看次数