时间戳

首页 > 解决方案 > 无法在 VueJS 中创建材料设计 (mdi) 复选框

javascript - 无法在 VueJS 中创建材料设计 (mdi) 复选框

问题描述

在我的应用程序中，我使用的是材料设计图标。我像这样加载它们：

<link href="https://cdn.materialdesignicons.com/2.5.94/css/materialdesignicons.min.css" rel="stylesheet">

它适用于应用程序的许多部分，但不适用于复选框。这就是我在其中一种方法中创建复选框的方式：

return this.$createElement(VCheckbox, {

});

我没有收到任何错误消息，但是在呈现页面时，我看到的不是复选框，而是一些文本：

在此处输入图像描述

我检查了 DOM 并看到了这个：

<div class="v-input__slot">
    <div class="v-input--selection-controls__input">
        <input aria-checked="false" role="checkbox" type="checkbox" value="">
        <div class="v-input--selection-controls__ripple"></div>
        <i aria-hidden="true" class="v-icon material-icons theme--light">check_box_outline_blank</i>
    </div>
</div>

所以，我看到应用了主题而不是mdi主题material-icons。我不知道如何解决它。我想要得到的是mdi-checkbox-marked-outline为选中的复选框和未选中的复选框设置课程mdi-checkbox-blank-outline。

标签： javascriptvue.jsvuetify.jsmaterial-design-icons

解决方案

推荐阅读