微信小程序获取无限量formId的方法

1.微信小程序获取多个formId的方法（解决小程序点击一次，提交多个表单问题）
利用点击穿透的原理，直接上代码吧

wxml代码：

<!-- 1 -->
<form bindsubmit="formSubmit" report-submit="{{true}}">
  <!-- 2 -->
  <button formType="submit" class='btn'>
    <form bindsubmit="formSubmit" report-submit="{{true}}">
      <button formType="submit" class='btn'>
        <!-- 3 -->
        <form bindsubmit="formSubmit" report-submit="{{true}}">
          <button formType="submit" class='btn'>
            <!-- 4 -->
            <form bindsubmit="formSubmit" report-submit="{{true}}">
              <button formType="submit" class='btn'>
                <view class='u-publish-btn'  bindtap='test'>发布</view>
              </button>
            </form>
          </button>
        </form>
      </button>
    </form>
  </button>
</form>

wxss代码

form button{
  padding: 0;
}

form button::after{
  content: '';
  display: none;
}

.u-publish-btn{
  position: fixed;
  bottom: 50rpx;
  left: 50%;
  transform: translateX(-50%);
  width: 698rpx;
  line-height: 90rpx;
  border-radius: 4rpx;
  background: #1a1a1a;
  font-size: 38rpx;
  font-weight: bolder;
  color: #fff;
}

js代码：

  formSubmit: function (e) {
    if (e.detail.formId != 'the formId is a mock one') {
      this.setData({
        formIdString: e.detail.formId + "," + this.data.formIdString
      })
    }
    console.log(e.detail, this.data.formIdString)
  }

显示页面：

点击按钮后最终结果：

本文转载于:猿2048https://www.mk2048.com/blog/blog.php?id=hik1ch2k11j