1. background-image 在手机上不支持解决方案
第一种: 绝对路径展示 (成功)
<image src="https://p9-passport.byteacctimg.com/img/user-avatar/bd2a77a3d3a7a8420ac2fa23c66d1fdb~300x300.image" alt="">掘金 </image>
第二种:用image标签替换 background-image (成功)
<image src='../image/xxx.png'></image>
第三种:backgorund-image:使用base64展示 (成功) 重点看坑位
坑在这里:
- url()里不能用双引号 可直接写成url(data:image/png;base64)
- 用Less中的data-uri 直接转成base64 也不能用双引号 正确写法 background-image:data-uri('../../image/xxxx.png')
background-image:data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAADlElEQVRYCdWZQUhUQRjHx4jCoqxLhyioWIp939MKu2xBrhCCpLcIgiK6dFgS1FRQKjxpJiHRQVE0Qndndo9Gt6BDsIegg0JYLpFBQrGR7bxFDLMX/3nvga66K73VpoXH7L43832/98033/fNLGMb+Ng2K7E7w9vtRGVZhgcvZuN03eI0aAkzIYUxKQWlpKA5KUi6F76n8Ax90BdjMBYylCyblWxAdf4uCiwRKk0Pn9gzz83DljCDUhg3snHjdkYQl8J8LjlNSU4zklNGcsq6F77j3hT6oC/GYCxkQBZk2olQKXTkp8jzFAKsePl5K2ZeloLGJTeSktOs5JSWMZIuzE/JaVFyWsq5cA/Psm7ftDPWSEIWZEI2dORBWPuR3cm2fU8cK5sfqziUjZlXZYzaJKcJyY3PLowtOf3NtejKmIBMyIYO6ILOtWly7qLjj2j5fksEI1JQtyVo2oLFOC34hPNeCJZdgEzIdnQEI9BZENKDy4xSQMbpviUoagnKWJx+/6XFPKhVLWQq2YKi0AWdBSFhamU5wHH65PoOfGuVgiLdW4IOpUsZJBgBQ86kMuatVviDO61RF26zwFbKBSQsKagbDKtWt7da4bTK54QKGZtpuZWAnJbc6Z5WDMtXN6yHmKRCSYzalPNugs8Vcgnlk074agOLipOIkYjqCJxOnEMoUas19w236jcixQRYwAQ2htSjMoQKwr7jnN8XceOkkQQT2BjyI1KQmyEQo/wq8TseDLNgAhtDEld50gnGfoUXa3waTGBjqDRU4ndya7EU+JMTIwkmsDGnZFJVCSoRf4KLNz6LKghsTNVzTsmEykMXQLBMgY2pwtKp3XRYIJ6BwDIDNgDOucXmVmYOD2S9FiwZsAHQKzx1A8yC7b8A1H6KU+4GR9dFYky6OzM9w4z2gVr7VKd9saB9uaV9wap/ya/7pgmbZK23nQoQ53+JUKm2G3fvqEHbow8PUPvDIzXdOh+/Lbckphs+WcwDzG+xyl9feejLh9ELqXdPax58HKtvfDHcXD0+2ESJkQFjaGjoaH9f35FHvb3mzfr6XR7Puq23uot1BPx+pCr9ZqD6bbK/7vWzh5e6RM+V1q47zXWtjY3n7ra3h9pbWkJNDQ1V9zo6qmtra/euC+Y98I7linWIPvPkVORlj3nmVdfJ449vnT7Yee3sgZqait2BQGAnY6wELcDC4fA+wzB2eBwFWwX6j/6G+AN+/t5fMohXEAAAAABJRU5ErkJggg==;
第四种: 直接在标签上写入相对路径 (开发工具OK 真机不成功)
<view class="header" style="background: url('../image/xxx.png')"></view>
2.wxml里不支持两个三元判断
{{orderInfo.status==30||orderInfo.status==40?'blue':'yellow'}} 不支持 ,需要用
使用 wxs解决 wxs 中不能用let 只能用var 不能用箭头函数 wxs 写法:www.jianshu.com/p/7a411e49a…
3.下拉刷新
设置了 overflow:hidden 不会触发
4.wxs中不能用数组的includes方法
5. 小程序支持less设置
vscode中配置 下载easy-less 安装点赞多的 那个 在vscode中配置 easy-less
"less.compile": {
"compress": false, //是否压缩
"sourceMap": false, //是否生成map文件
"out": true, // 是否输出文件,false为不输出
"outExt": ".wxss", // 输出文件的后缀,小程序可以写'wxss'
},
然后在小程序中去掉less 的上传
6.阿里图标库使用。 icon-font 图标引入
如何引入:www.jianshu.com/p/0d631d3b1… 转换ttf 字体库:transfonter.org/ 微信忽略文件: developers.weixin.qq.com/miniprogram…