canvas 使用外部字体无效

虽然字体文件已经请求成功，但使用时还是无效。

首先引入

<style>
@font-face {
  font-family: Poppins;
  src: url('@/assets/fonts/Poppins-SemiBoldItalic.ttf');
}
</style>

再使用以下方式判断字体加载状态，当字体加载完后再使用字体。 

document.fonts.load('bold 18px Poppins').then(() => {
  ctx.font = 'bold 18px Poppins' //字体大小及样式
  ctx.fillText(4,  22,  15) //内容及坐标
})

注意：如果你的字体名称有空格需要用引号，如："bold 18px 'Poppin s'"