微信小程序开发的坑

334 字2 分钟阅读

Swiper高度自适应

swiper组件设置高度100%无法生效,这时需要通过手动获取屏幕的高度并给swiper设置

javascript
data:{	swiperHeight: 0;}//监听页面加载onLoad:function (option){	const _this = this;	wx.getSystemInfo({		success:functioin(res) {			const clientHeight = res.windowHeight;			const clientWidth = res.windowWidth;			const ratio = 750 / clientWidth;//计算为百分比			const rpxHeight = ratio * clientHeight;			_this.setData({				_this.swiperHeight: rpxHeight;//将计算好的高度给定义好的值      })		} 	})}

将获取到的屏幕高度给swiper设置上

html
<swiper style="height:{{swiperHeight}}rpx;"><swiper/>

注意:style最后的rpx千万不能省略,否则不生效

小程序下载、预览文档

把文件下载到临时的缓存,然后再打开。需要注意上线的项目中文件地址需要https

javascript
onLoad: function(res){  var url = '文件地址';  wx.downloadFile({ //下载    url: url,    success: function(e){      const filePath = e.tempFilePath; // 临时文件地址      wx.openDocument({ // 预览        filePath: filePath,        success: function (ret) {          console.log('打开文档成功')        }      })    },    fail: function(r){      console.log(r)    }  })}

云开发中数据库的权限问题

需要注意不同的权限导致api获取数据为空

云函数中使用axios不能直接对返回值进行操作

解决方案:使用cheerio + utils

相关资料:cheerio

javascript
await axios.request({  ...}).then((res)=>{  let data = eval (util.inspect(res.data));  cookie = eval(util.inspect(res.headers["set-cookie"][0]));
  const $ = cheerio.load(data);  $("#casLoginForm input").each((index,item)=>{    //解析html    ...  })})    

解析并渲染Markdown

wxpraser-plugin使用

按下K进行搜索