# 常见问题

在特定问题上被卡住？ 在创建工单之前先回顾下这些常见的问题和答案。 If you still cannot find what you are looking for, you can submit an issue on GitHub or ask the in our community.

# 目录列表

# 问题专区

有一个属于这里的问题？ 在我们的 Discord 社区 告诉我们或在我们的 Issue 生成器 上创建一个请求。

  • Vuetify v3 何时发布？

    通过我们的Github项目或者阅读路径图的内容来关注我们的进度


  • 由于sass / scss 错误，我的应用程序不会编译。

    Ensure that you are have webpack configured properly using the proper options object in accordance with your sass-loader version. See the webpack install section for details.


  • 为什么搜索 Vuetify 不能正常工作？

    此刻，Algolia docsearch 只是主生产站点的 crawls 。 https://vuetifyjs.com/。


  • v2网格比较v1.5是否有示例？

    是的，你可以在这里查看 网格示例。


  • 错误：找不到模块“node-sass”。

    确保您的 @vue/cli-* 软件包位于 package.json 至少 ^3.5.0。


  • @content：期望"}"之后无效的 CSS “($material-light);”。

    请确保您在您的 package.json 中使用 sass 而不是 node-sass。


  • 我的应用程序无法工作。

    首先，确保你使用的是最新版本的 Vue.js 和 Vuetify。 尝试在 codepen 中使用这个模板重现它。 如果你无法在本地环境之外重现问题，这通常意味着这个问题是一个本地问题。 如果你仍然无法解决问题，请在社区合适的帮助频道中提供你的代码和问题描述。


  • 我看到 $attrs 只读 和/或 $listeners 只读 控制台

    Vuetify 使用Typescript，当前必须导入并扩展Vue 对象。 这在某些应用程序中有可能生成警告信息。 There is currently an ongoing GitHub discussion with potential work-arounds in a variety of use-cases.


  • 我发现 Error in ./node_modules/vuetify/src/dir/file.js Module parse failed: Unexpected token (<lineno>:<characterno>) 在控制台.

    如果您使用的是IDE，比如intelliJ IDEA或WebStorm，它通常会添加指向所使用组件的vuetify/src目录的自动导入。 将导入语句路径从 vuetif/src 更改为 vuetif/lib。



  • 如何基于 Vuetify 开发组件

    Vuetify 组件可以轻松地通过导入它并使用 extends 选项来扩展。 Codepen 示例

// src/components/ActivateBtn
import { VBtn } from 'vuetify/lib'

export default {
  extends: VBtn,

  methods: {
    // 这里我们重写了VBtn 的 genContent 方法来覆盖默认的 genContent 方法.
    genContent() {
      return this.$createElement('div', {
        staticClass: 'v-btn__contents'
      }, [
        'Activate ',
        this.$slots.default
      ])
    }
  }
}

  • 我的应用程序无法工作。

    Vuetify 需要使用 v-app 组件。 它应该将您的整个应用程序包裹，并且是包括主题在内的大部分框架功能的中心点。 请确保遵循在 应用程序 页面中记录的正确标识。


  • Menu/Dialog/Navigation 抽屉未正确打开。

    确保你的组件被包裹有一个 v-app 元素。 如果您正在使用一个元素来激活未放入 activator 槽中的组件， 确保您停止点击事件的传播。 这些组件使用 v-outside-click 指令，并将立即关闭。


  • 滚动条正在显示，即使我的内容没有垂直溢出。

    Vuetify 使用稍作修改版本的 resse reset ，默认情况下使用 html 滚动条来正常化浏览器之间的行为。 这是一种设计上的选择，已经多次辩论。 有滚动条和没有滚动条都有利弊，到目前为止，投票赞成保持现状。 如果您想禁用此功能，只需将 html { overflow-y: auto } 添加到您的样式文件中。 在 CSS 重置 页面上查找更多信息。

  • 如何垂直居中内容？

    将 fill-height prop 应用于 v-container。 这个辅助类通过只增加 height: 100%, 但是对于容器, 它还查找子 v-layout 并添加应用所需的类将内容垂直居中。

  • 个人中心_/_ 链接在我在 /首页 页面上处于激活状态。

    将 exact 添加到指向绝对值 /的链接。 欲了解更多信息，您可以访问官方的 Vue 路由器 文档。


  • 为什么我的应用程序在移动设备上没有响应式布局？

    请确保您的 index.html的 <head> 内有正确的 meta 标签。

<!-- public/index.html -->
<html>
<head>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
</head>
</html>

  • 如何使用 Font Awesome, Material Design 图标或Material 图标？

    您可以在我们的 图标指南 中找到更多信息。


  • 为什么在点击按钮后立即关闭 <v-dialk> ？

    当不为 v-menu 和 v-dialogue 使用 activator 插槽时. 您必须手动停止点击事件的传播。 要做到这一点，只需将 .stop 修改器添加到单击事件。

<!-- Vue Component -->
<template>
  <div>
    <v-dialog v-model="dialog">
      <v-card>...</v-card>
    </v-dialog>

    <v-btn @click.stop="dialog = true">
      打开弹窗
    </v-btn>
  </div>
</template>

<script>
  export default {
    data: () => ({
      dialog: false,
    }),
  }
</script>


  • 如何报告错误或请求功能？

    为了确保提供所有需要的信息，我们创建了一个 问题生成器 ，帮助您完成这个过程。 不使用生成器创建的任何问题都将自动关闭，所以请使用它。


  • vuetify-loader没有加载所有组件。

    Vuetify-loader 在 动态 组件中有限制。 请务必检查 限制 部分以获取更多信息。


  • 1.5 版本将被支持多久？

    到2020年7月为止。 更多信息位于 长期支持 页面。




  • SCRIPT5022: 预期为标识符, 字符串或数字

    为了支持 vue-cli-3 中的 ** 现代模式** ， vuetify/lib 没有被编译。 你必须告诉vue-cli 来编辑 vutify 包。 这是在安装Vuetify cli插件时自动配置的。 如果您正在使用旧版本，只需在 vue.config.js 中将 ‘vuetify’ 添加到 transpileDependencies 数组。


  • 添加typescript - 错误：无法找到模块 ‘vuetify/lib’ 的声明文件

    在 tsconfig.json 中使用 vuetify 更新 compilerOptions 的 type类型：

// tsconfig.json
{
  "compilerOptions": {
    "types": ["vuetify"]
  }
}

# 需要帮助?

如果您需要帮助，请使用我们的一个帮助渠道：


如需更多查询，请联系 John Leider or Heather Leider

了解更多？

继续学习由 我们的团队 选择的相关内容，或通过使用下面的导航链接在页面之间跳转。
在 GitHub 上编辑此页面
最后更新：11/12/2024, 6:59:50 AM