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

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

阅读 6.9k
2 个回答
新手上路,请多包涵

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

  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 问题解决了!

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题