[QuasarJs]: Quasar 怎么使用自定义图标

使用quasar JS的大佬请给出思路或者贴下代码.

回答:

目前我是这么解决的。要是有更好的方案希望能告知。

  1. 文件都放到statics下面。
  2. index.template.html引入css

    <link rel="stylesheet" type="text/css" href="statics/css/iconfont.css">

  3. <q-icon class="iconfont" name="icon-name" />

回答:

// 对于组件内的icon,eg:

<q-field
  icon="wifi"
>
  <q-input v-model="text" float-label="Input float label" />
</q-field>
  1. 通过 https://github.com/quasarfram… 发现,框架并没有像自带的几种字体那样提供原生支持。
  2. 只好分析源码:https://github.com/quasarfram…
  3. 通过源码分析发现,只要字体名称和前缀满足:bt&bt-eva&eva-mdi&mdi-中的一种可以得到支持
  4. 于是打开iconfont,进入项目图标,设置如下:

clipboard.png

  1. 修改上述实例代码 icon="wifi"改为icon="bt-wifi"

OK 问题解决了!

暂无评论

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注