[技術博客] 微信小程序的formid獲取

微信小程序的formid獲取

formId的觸發

微信小程序能夠經過收集用戶的formid，獲取formid給用戶主動推送微信消息。獲取formid有兩個途徑，一個是觸發一次表單提交，或者觸發一次支付行爲。若是要給用戶主動推送模板消息，就須要拿到足夠多的formid。

用表單的方法必定須要綁定bindsubmit，button的form-type設置爲submit，在js代碼中能夠經過e.detail.formId 獲取formId。

實例：

<form bindsubmit="submit" report-submit='true' class='formid'>
<button form-type="submit"></button>
</form>

submit: function (e) {
  console.log(e.detail.formId);
}

獲取formid的tips

若是沒有點擊事件，能夠把button設置爲透明的，在每一處點擊均可以收集formId

若是想同時觸發formid和點擊事件，能夠採用以下方法：

一、在點擊事件的外層套上form和button，可是須要修改button的默認樣式，至關於在外面套一層透明的蒙版。

二、直接用button綁定點擊事件，把要觸發的函數寫入。

三、在點擊事件內嵌套form和button，也須要修改button的默認樣式。

去除button默認樣式

這是button的默認樣式：

button {
  position:relative;
  display:block;
  margin-left:auto;
  margin-right:auto;
  padding-left:14px;
  padding-right:14px;
  box-sizing:border-box;
  font-size:18px;
  text-align:center;
  text-decoration:none;
  line-height:2.55555556;
  border-radius:5px;/*能夠改爲0，去除圓角*/
  -webkit-tap-highlight-color:transparent;
  overflow:hidden;
  color:#000000;
  background-color:#F8F8F8;/*按鈕默認背景色是灰色的，能夠把值改成#fff白色*/
}

去除button的邊框：使用::after 僞類選擇器，由於button的邊框樣式是經過::after方式實現的，若是在button上定義邊框就會出現兩條邊框線，因此咱們可使用::after的方式去覆蓋默認值。

button::after {
  border: none;
}

button::after{ border: none; }