微信小程序遇到的坑

最新推荐文章于 2023-04-20 22:36:12 发布

Null_Bugs

最新推荐文章于 2023-04-20 22:36:12 发布

阅读量1.8k

点赞数

分类专栏：小程序

本文链接：https://blog.csdn.net/Null_Bugs/article/details/79806038

版权

小程序专栏收录该内容

11 篇文章 0 订阅

订阅专栏

1、渲染图片

 
  < 
  view 
  wx:for= 
  '{{item.src}}' 
  wx:for-item= 
  "src" 
  > 
 
 
  < 
  image 
  src= 
  "https://yffice.com{{src}}" 
  class= 
  "slide-image" 
  /> 
 
 
  </ 
  view 
  > 
 

2、小程序要求所有的打包上传的文件不超过2M，图片都已经压缩，还是超载了，所以将一部分放到远程服务器，然后再请求，但是远程服务器的域名不需要再加入到域名信息中。

3、canvas绘制图片的时候，使用drawImage(),如果图片是请求服务器上的，会画不出来。

 
  var 
  that = 
  this 
 
 
  var 
  avatar = 
  this. 
  data. 
  avatar 
 
 
  var [ 
  W, 
  H] = [ 
  this. 
  data. 
  deviceInfo. 
  windowWidth, 
  this. 
  data. 
  deviceInfo. 
  windowHeight] 
 
 
  wx. 
  getImageInfo({ 
 
 
  src: 
  avatar, 
 
 
  success 
  : 
  function ( 
  res) { 
 
 
  wx. 
  setStorage({ 
 
 
  key: 
  'storageHeadImg', 
 
 
  data: 
  res. 
  path, 
 

   }); 
 
 
  let 
  storageHeadImg = 
  wx. 
  getStorageSync( 
  'storageHeadImg') 
 
 
  ctx. 
  drawImage( 
  storageHeadImg, 
  0, 
  0, 
  132, 
  132, ( 
  W - 
  132 / 
  750 * 
  W) / 
  2, 
  H * 
  0.04, 
  132 / 
  750 * 
  W, 
  132 / 
  750 * 
  W) 
 
 
  ctx. 
  draw() 
 

   } 
 

   }) 
 