微信小程序bug,真机调试莫名的黑色框框

在微信开发者工具显示text但是没有任何内容,而在真机调试中会出现莫名其妙的框框,请各位指点指点
在真机中是这样的

img


img


img


在开发者工具wxml是这样的

img

微信开发者工具版本号2.30.0

方案来自 梦想橡皮擦 狂飙组基于 GPT 编写的 “程秘”


这种情况可能是由于字体文件的缺失或者不支持所导致的。

一种可能的解决方法是,在微信小程序的全局CSS文件中(app.wxss)设置-webkit-text-stroke属性,例如:

* {
  -webkit-text-stroke: 1px;
}
  • 这个属性可以给文本添加描边,同时也可以解决一些字体不兼容的问题。将它应用到所有元素中,就可以消除这种情况下出现的黑色框框。

  • 另外,如果你使用了自定义字体文件,可以检查一下字体文件的格式是否正确,并且是否被正确引用。

  • 如果这些方法都不起作用,可以考虑使用其他字体文件,或者尝试升级微信开发者工具和微信小程序版本。