qin.loadFontFace(Object object)

动态加载字体。一般有 2 个应用场景：

使用css字体图标。字体图标相比图片的优势是：体积小、矢量不怕失真、支持点击变色。
使用自己的字体，而不是 os 提供的字体，来渲染整个界面的文字

平台差异说明

H5	微信小程序	百度小程序	抖音小程序	小红书小程序
2.3.4+	1.11.0+	x	x	x

参数说明

属性	类型	默认值	必填	说明
global	Boolean	false	否	是否全局生效。微信小程序 `'2.10.0'`起支持全局生效，需在 `app.vue` 中调用。
family	String		是	定义的字体名称
source	String		是	字体资源的地址。见下
desc	Object		否	可选的字体描述符
success	Function		否	接口调用成功的回调函数
fail	Function		否	接口调用失败的回调函数
complete	Function		否	接口调用结束的回调函数（调用成功、失败都会执行）

source

微信小程序端只支持网络字体，字体链接必须是 https 。
微信小程序端字体链接必须是同源下的，或开启了 cors 支持，微信小程序的域名是 servicewechat.com
本地字体请放在 /static 目录下，否则打包时不会把字体文件打进去
字体格式支持：

webview 渲染时，建议格式为 TTF 和 WOFF ， WOFF2 在低版本的 iOS 上会不兼容。

Object.desc 的结构

属性	类型	默认值	必填	说明
style	String	normal	否	字体样式，可选值为 normal / italic / oblique
weight	String	normal	否	字体粗细，可选值为 normal / bold / 100 / 200/ 900
variant	String	normal	否	设置小型大写字母的字体显示文本，可选值为 normal / small-caps / inherit

代码示例

qin.loadFontFace({
  family: 'Bitstream Vera Serif Bold',
  source: 'url("https://sungd.github.io/Pacifico.ttf")',
  success() {
    console.log('success'),
  },
});

qin.loadFontFace({
  family: 'Bitstream Vera Serif Bold',
  source: 'url("https://sungd.github.io/Pacifico.ttf")',
  success() {
    console.log('success'),
  },
});

WARNING

插件市场有加载字体的例子：插件市场
引入中文字体，体积过大时会发生错误，建议抽离出部分中文，减少体积，或者用图片替代
工具里提示 Faild to load font可以忽略

qin.loadFontFace(Object object) ​

平台差异说明 ​

参数说明 ​

代码示例 ​

qin.loadFontFace(Object object)

平台差异说明

参数说明

代码示例