1. 程式人生 > >關於微信小程式的一點經驗

關於微信小程式的一點經驗

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