关于微信小程序的一点经验

Posted 2021-01-20 周十发

2018年的11月份，自己做微信小程序相关的项目已经有四个月，这四个月自己走过很多弯路，也学到了不少经验，下面就一一总结：

一，微信小程序的radio组件是可以改变按钮样式的（比如大小，颜色等等）

改变大小解决办法：https://blog.csdn.net/iafmay/article/details/79479288 

改变其他样式：https://blog.csdn.net/abs1004/article/details/78922596

二,关于display:flex;子集盒子被压缩，

解决办法是：给该子元素添加一个属性flex-shrink:0;

在微信社区的提问：https://developers.weixin.qq.com/community/develop/doc/0002840bec0498667f876640556800

三，让背景图片自适应的代码 style="background:url(/images/cc.jpg) no-repeat 0 0 / 100% 100%"

四，禁止屏幕滑动："disableScroll":true

五，display:flex;常用的居中属性：

display: flex;
align-items: center;
justify-content: space-between;

六，小程序图片自适应：

解决办法网址：https://www.cnblogs.com/myboogle/p/6306351.html

七，经常用到的超出一行显示省略号（或者两行等）

overflow: hidden;/*超出部分隐藏*/
white-space: nowrap;/*不换行*/
text-overflow:ellipsis;/*超出部分文字以...显示*/

八，让背景图片显示完整 https://zhidao.baidu.com/question/986803885494343379.html

九，clearfix方法

.clearfix {
  zoom: 1;
}

.clearfix::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}

十，json数组增删改查的方法：

s数组
//删除起始下标为1，长度为1的一个值(len设置1，如果为0，则数组不变)
var arr = [\'a\',\'b\',\'c\',\'d\'];
arr.splice(1,1);

var emp = [\'abs\',\'dsf\',\'sdf\',\'fd\']
emp.remove(\'fd\');

//替换起始下标为1，长度为1的一个值为‘ttt’，len设置的1
var arr = [\'a\',\'b\',\'c\',\'d\'];
arr.splice(1,1,\'ttt\');

//添加 ----  len设置为0，item为添加的值
var arr = [\'a\',\'b\',\'c\',\'d\'];
arr.splice(1,0,\'ttt\');

//数据拼接
a.concat(b);

十一，css3旋转动画

https://www.jianshu.com/p/4c1928534c4f

十二，小程序实现大转盘，九宫格抽奖，带跑马灯效果

https://developers.weixin.qq.com/community/develop/article/doc/000ca6e3e6c8c02f4238aafe556813