Vuetify 文本字段边框丢失

Question

我正在尝试实施 Veutify 的 text field

这就是我现在的样子：

这是文本字段处于焦点时的样子：

这些是我在 main.js

进口的

import Vue from 'vue';
import Vuetify from 'vuetify';
Vue.use(Vuetify);

我是不是遗漏了一个导入或其他东西？

Answer 1

我运行在同一个问题中，您需要将您的应用程序包装在 <v-app>.

原因是边框的颜色取决于您使用的主题。如果您尝试检查文档，您会发现边框的规则类似于 .application--light .input-group .input-group__details：application--light 确实是 v-app 添加的 class。

Answer 2

同样的问题但是我通过这个解决方案修复了。请将此 link(CDN) 添加到您的 html 文件中。

<link rel="stylesheet" href="https://unpkg.com/vue-material/dist/vue-material.min.css">
<link rel="stylesheet" href="https://unpkg.com/vue-material/dist/theme/default.css">


<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vue-material"></script>

别担心没有崩溃。

Vuetify 文本字段边框丢失

Vuetify text field border missing

vue.js

vue-component

vuetify.js