NativeScript Vue-材质设计图标未显示

Question

在资产/字体中，我有materialdesignicons-webfont.ttf，在资产/ css中，我有materialdesignicons.css。最后在main.js中，我有以下内容：

import {TNSFontIcon, fonticon} from 'nativescript-fonticon';

TNSFontIcon.debug = true;
TNSFontIcon.paths = {
  'mdi': './assets/css/materialdesignicons.css'
};
TNSFontIcon.loadCss();

Vue.filter('fonticon', fonticon);

我正在使用如下图标：

<Label class="mdi" :text="'mdi-youtube' | fonticon" style="color: #fff;font-size: 40px;" />

但是，图标根本没有显示。

顺便说一句，我从https://github.com/Templarian/MaterialDesign-Webfont/tree/master/css那里抢了css。

请帮助！

Answer 1

将这些行添加到CSS中，

.mdi {
  font-family: "Material Design Icons", "materialdesignicons-webfont";
}

基本上，项目中的后记名称，字体文件名。另外，您必须使用fonts目录而不是assets/fonts，默认情况下，fonts目录下的文件仅在应用启动时自动注册。