关于数字替换图片数字问题的两种解决方案（结合canvas动态画图）（正则替换和双for循环）...

最近做了一个数字和图片对应转化的需求，因为产品需求的数字是特殊字体，系统默认字体需要用UI给的图片进行相应替换。 注：红色字体是核心代码

下面是两种解决方案：

1.使用正则匹配替换 arguments[0]存入数组

formatLetter(clockInSum, ctx) {
      

letterbox.map(function(value, index, array) {
console.log('value===', value, index)
        wepy.downloadFile({
url: value
        }).then((res5) => {
console.log('输出的res5===', res5.tempFilePath)
          index = index + 1
          var letVal = index * 100
          var topVal = index * 100
          ctx.drawImage(res5.tempFilePath, letVal, topVal, 50, 50)
          ctx.draw(true)
        })
return true
      })
    }

formatLetter(clockInSum, ctx) {

letterbox. map( function(value, index, array) {
console. log( 'value===', value, index)
wepy.downloadFile({
url: value
}). then((res5) => {
console. log( '输出的res5===', res5.tempFilePath)
index = index + 1
var letVal = index * 100
var topVal = index * 100
ctx. drawImage(res5.tempFilePath, letVal, topVal, 50, 50)
ctx.draw( true)
})
return true
})
}

相比较而言 还是第一种正则匹配替换的方式更好一些 大家可以试试