最近在使用 Taro 开发小程序的时候, 碰到一个 bug, 在微信开发者工具上看是正常的 (这是因为微信开发者工具还是在电脑上运行的, 而不是真机. 具体情况以真机调试结果为准), 但是真机调试时 画布上的 图片不显示, 最开始是 安卓端和苹果端都不显示. 当时的代码

<CoverView className='gonwei-box' onClick={() => this.open(false, '')}>     
  <CoverImage src={dateBoxIcon} className="image">
  </CoverImage> 
</CoverView>

查看文档发现是因为 cover-image 上面不支持 svg 文件的显示. (因为需要 覆盖在原生组件之上的图片视图。 所以没有使用 image), Taro 的 CoverImage 组件也只是对小程序的 cover-image 进行了一层封装, 原装都不支持它也没办法
图片
svg 文件不支持只好将它转化为 png 的格式, 根据文档显示 png 格式苹果和安卓都支持实现. 但是在真机调试时, 安卓端可以正常显示, 但是 苹果端显示异常.最终解决办法在 config/index.js 文件内

const config = {     
  mini: {         
    imageUrlLoaderOption: { // 加入该属性, 针对 png | jpg | jpeg | gif | bpm | svg 文件的 url-loader 配置             
    limit: 100 // 默认值, 可以按需调小           
  }     
        } 
} 

星星与野狗
1 声望0 粉丝