- 当前 Bug 的表现(可附上截图)
在 app.js 中进行引入网络字体样式,代码如下:
onLaunch: function () { wx.loadFontFace({ family: 'HYZhengYuan' , source: 'url("https://xxx.com/fonts/HYZhengYuan-45W-2.otf")' , success: function (res) { console.log( "字体加载成功:" + res.status) // loaded }, fail: function (res) { console.log( "字体加载 error:" + res.status) // error }, complete: function (res) { console.log( "字体加载:" + res.status); } }); } |
随后在 app.wxss 中配置字体样式:
page { background-color: #F7F7F7; height:100%; font-family: HYZhengYuan !important; } |
发现只有 index 页面下除 textarea 引入无效之外,其他内容均应用字体样式成功,但是其他的页面则引用无效。
在模拟器中演示效果正确,但在实际真机上,textarea 无效,部分截图如下:
以下为测试设备型号:
模拟器:iPhone X
真机:iPhone XS MAX
- 预期表现
在全局 app.js 加载字体样式,并在 app.wxss 中引用后,当前小程序字体样式随即变更。
- 复现路径
- 提供一个最简复现 Demo
我也遇到同样的问题(基础库 2.6.6),在 onLaunch 中执行官方的例子无法正常加载,在开发工具中只有在执行函数的地方加断点才可以激活字体,不加断点刷新页面几个回调函数都不会被调用,原因不明。
App({
onLaunch:
function
() {
// 加断点
wx.loadFontFace({
family:
'Bitstream Vera Serif Bold'
,
source:
'url("https://sungd.github.io/Pacifico.ttf")'
,
success(res) {
console.log(res.status)
},
fail:
function
(res) {
console.log(res.status)
},
complete:
function
(res) {
console.log(res.status)
}
});
}
});
在具体页面内调用没发现问题,但不能全局统一加载是很麻烦的事情,希望能解决这个问题。
这个问题解决了吗
你好,textarea是原生组件,不支持使用该接口添加的字体,具体请参考:https://developers.weixin.qq.com/miniprogram/dev/api/wx.loadFontFace.html
您好,那针对非 Canvas 原生组件,目前每页单独加载字体样式后才可使用加载的字体,能不能直接在 app.js 中加载,之后后续的每个页面的非 Canvas 原生组件字体样式改变呢