经常问的问题

卡在一个特殊问题?在创建票证前请先检查一些常见的陷阱。如果您仍然无法找到要查找的内容,请在Github上提交一个 issue或者在 discord上向社区提问。

我的代码无法工作——我应该怎么做?

首先,确认您是否使用了了最新版本的Vue.js和Vuetify。尝试在codepen中使用这个模版重现问题。如果您无法在环境之外重现问题,通常意味着问题在本地。如果您仍然无法解决您的问题,请提供您的codepen和issue到社区#need-help 频道。

我的应用程序看起来不正确。

Vuetify必须使用v-app组件。它应该包装您的整个应用程序,并且是许多框架功能的中心点。如果由于某种原因您不能使用这个元素,您可以通过属性和类来模仿它,只需在可用的最上层元素(不包括body)以及application application--{light|dark} 类中将data-app属性设置为true。

暗黑和亮白主题不能正常工作。

Vuetify需要一个安装点来执行诸如主题样式等任务。请确定有一个v-app封装这您的应用程序。如果这是不可能的,无论处于何种原因,您可以通过将data-appclass="application application--light (或者 dark)" 应用于到您的应用程序的最上层元素来模仿其行为。

菜单/对话框/导航抽屉无法正确打开。

确保你的组件是用v-app元素包装的。如果您使用了一个元素去激活未被放置在激活器插槽中的组件,请确保停止了单击事件的冒泡传播,这些组件利用v-outside-click指令并将会立即关闭。

即使我的内容没有垂直移除,滚动条依然显示。

Vuetify默认开启了html滚动条。这是一个设计上已经过多次辩论的选择,各有利弊。截至目前,表决赞成保持原样。如果你想禁用这个功能,只需在你的样式文件中添加html {overflow-y:auto}

如何垂直居中?

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

我不在 /home 页面, / 链接却会被激活。

exact添加到指向绝对路径 /。欲了解更多信息,你可以访问官方Vue路由文档.

我的页面在手机上没有响应式

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">添加到index.html文件的<head>节点中。

我怎么使用Font Awesome图片和Material Design图标(mdi)?

您必须添加字体到您的index.html文件或者其他的方式导入到您的项目中
MDI: Material Design Icons
FA: Font Awesome

点击按钮后,我的对话框立即关闭

例如,当不使用activator插槽作为v-menuv-dialog时您必须停止点击事件的冒泡传播。为此,只需简单地将.stop 修饰符添加到点击事件, `@click.stop="myMethod"`.

使用相对路径的图片在v-card中不起作用

Vue加载器会自动将相对路径转换未require函数。不幸的是,当涉及到自定义组件时,情况并非如此。您可以使用require来避开这个问题。

<v-card :src="require('path/to/img/img.jpg')">

Edit this page | language on Github
Vuetify 3 is now available!The latest version of Vuetify is now available!
Learn about Vuetify 3's new features and functionality for modern Vue applications
Start exploringExplore