小编Kav*_*404的帖子

如何格式化Vuetify数据表日期列?

我有一个使用Vuetify数据表的简单数据表。其中一列是createdOn(日期时间),我想对其进行格式化。我该怎么做 ?

这就是我现在得到的:

这就是我现在得到的

<template>
   <v-layout>
      <v-data-table :headers="headers" :items="logs">
      </v-data-table>
   <v-layout>
</template>
<script>
      headers: [
        { text: "Time", value: "createdOn", dataType: "Date" },
        { text: "Event Source", value: "eventSourceName" },
        { text: "Event Details", value: "eventDetails" },
        { text: "User", value: "user" }
      ],
      items: [],
</script>
Run Code Online (Sandbox Code Playgroud)

javascript vue.js vuejs2 nuxt.js vuetify.js

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

如何使用 Terraform 使 AWS CloudFront 分发缓存失效?

我正在寻找一种使用 Terraform 使 CloudFront 分发缓存失效的方法。

我在文档中找不到任何信息。

这可能吗?如果可能的话,如何实现?

amazon-web-services amazon-cloudfront terraform terraform-provider-aws

9
推荐指数
1
解决办法
9016
查看次数

如何在 vuetify 表单中添加调用 API 的自定义验证?

我正在尝试向表单添加自定义验证以测试重复条目。我怎样才能仅使用 vuetify 验证来做到这一点。如果用户输入重复,我想显示内联错误消息。

vuetify.js

6
推荐指数
1
解决办法
6941
查看次数

如何手动更新 vuetify 数据表中的记录范围?

我有一个像这个例子中的 v-data-table https://vuetifyjs.com/en/components/data-tables#paginate-and-sort-server-side 服务器端分页和排序。我有几个下拉列表,它们用作填充相同数据表的相同 API 的过滤器。我的问题是当我更改过滤器时,记录范围会得到错误的值。有没有办法重置所有页脚组件。我检查了我找不到方法的文档。

在此处输入图片说明

vue.js nuxt.js vuetify.js

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

单击已选择的树项时,如何停止 Vuetiify v-treeview 取消选择?

我的项目中有一个 vuetify v-treeview 启用了可激活。假设用户已经选择了树项目之一。稍后,他/她单击已选择的树项。问题是它没有被选中。有没有办法防止这种情况?

<template>
  <v-treeview
    shaped
    hoverable
    activatable
    :items="items"
  ></v-treeview>
</template>

<script>
  export default {
    data: () => ({
      items: [
        {
          id: 1,
          name: 'Applications :',
          children: [
            { id: 2, name: 'Calendar : app' },
            { id: 3, name: 'Chrome : app' },
            { id: 4, name: 'Webstorm : app' },
          ],
        },
        {
          id: 5,
          name: 'Documents :',
          children: [
            {
              id: 6,
              name: 'vuetify :',
              children: [
                {
                  id: 7,
                  name: 'src :',
                  children: [ …
Run Code Online (Sandbox Code Playgroud)

vue.js vuetify.js

3
推荐指数
1
解决办法
1103
查看次数

Vuetify Item组如何预选item?

我正在尝试从 vuetify 预选择项目item-group。它适用于字符串,但不适用于对象。在 vuetify 文档中,他们使用字符串数组作为项目组的项目列表。效果很好。

如果我尝试使用对象数组作为项目列表,它不起作用

<div id="app">
  <v-app id="inspire">
    <v-card class="mx-auto" max-width="500">
      <v-list shaped>
        <v-list-item-group v-model="model" multiple>
          <template v-for="(item, i) in items">
                <v-divider
                  v-if="!item"
                  :key="`divider-${i}`"
                ></v-divider>

                <v-list-item
                  v-else
                  :key="`item-${i}`"
                  :value="item"
                  active-class="deep-purple--text text--accent-4"
                >
                  <template v-slot:default="{ active, toggle }">
                    <v-list-item-content>
                      <v-list-item-title v-text="item.name"></v-list-item-title>
                    </v-list-item-content>

                    <v-list-item-action>
                      <v-checkbox
                        :input-value="active"
                        :true-value="item"
                        color="deep-purple accent-4"
                        @click="toggle"
                      ></v-checkbox>
                    </v-list-item-action>
                  </template>
          </v-list-item>
          </template>
        </v-list-item-group>
      </v-list>
    </v-card>
  </v-app>
</div>

new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  data: () => ({
    items: [
      { name: "Connect"}
    ],
    model: …
Run Code Online (Sandbox Code Playgroud)

javascript vue.js vuetify.js

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