vuetify 3 v-radio是透明的

at0kjp5o 于 2023-03-09 发布在 Vue.js

关注(0)|答案(1)|浏览(156)

vuetify 3现在已经出来了，所以我开始使用v-radio-group Package 的v-radio，v-radio本身工作正常，但问题是单选按钮是透明的，即使我改变了单选按钮的颜色，也只有当它们悬停时才会改变。
下面的截图显示了当时的情况，在“你好”的左侧，有透明的单选按钮。
我想知道如何解决这个问题。任何建议将不胜感激。

<v-radio-group v-model="secondKw" inline class="ma-1">
   <v-radio
      v-for="kw in keywords"
      :label="kw"
      :value="kw"
      v-bind:key="kw"
   ></v-radio>
</v-radio-group>

即使我尝试了网站上的示例代码。他们是透明的。有什么可能的解释吗？其他风格被采用到这个项目。

vue.js

来源：https://stackoverflow.com/questions/74597963/vuetify3-v-radio-is-transparent

1条答案

按热度按时间

tjvv9vkg1#

你现在可能已经明白了，但不管怎样：
这通常发生在您没有安装任何图标字体，即材质设计图标或字体真棒。
比较两个代码段，第一个没有图标，第二个有：

const { createApp, ref } = Vue;
const { createVuetify } = Vuetify
const vuetify = createVuetify()
createApp({}).use(vuetify).mount('#app')

<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/vuetify@3.1.4/dist/vuetify.min.css" />
<div id="app" class="d-flex justify-center">
  <v-app>
    <v-checkbox label="checkbox without icons"/>
  </v-app>
</div>
<script src="https://unpkg.com/vue@3/dist/vue.global.prod.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vuetify@3.1.4/dist/vuetify.min.js"></script>

一个二个一个一个
documentation for icon fonts将提供更多详细信息。

赞(0）回复(0）举报 2023-03-09

我来回答

vuetify 3 v-radio是透明的

1条答案

相关问题

热门标签

最新问答