uni-app小程式訊息推送

曾小曾發表於2019-09-20

留下使用者不易,且行且珍惜

小程式推送使用者訊息,可以模板建立一個form表單(最好用系統自帶的button)

<form @submit="handlePush" report-submit='true'>
  <button formType="submit">推送訊息</button>
</form>
複製程式碼

   小程式的formId需要儘可能的在使用者互動比較頻繁的操作點上面加好埋點,所以就會在頁面的多個地方加form。之前看網上的做法上有一種是在一個button上迴圈巢狀n個form表格,當使用者點選一次之後就可以一次性拿到這n個formId值。實際上這種做法目前好像並不湊效,應該被微信和諧了,你會發現巢狀再多層最終拿到的formId值都是一樣的,所以巢狀form的作用就不大了。

   另外,在小程式的主入口頁,因為這裡是uni-app開發,app.vue為主入口,要拿取formId值的話首先肯定會想到在這裡拿formId,這樣就一勞永逸了。通常做法就是隱藏一個form表單,然後在生命週期裡trigger表單提交事件。但實際是微信不支援更不建議dom操作...

   綜上,還是老老實實的多加幾個點吧。當然,偷懶還是要偷的,加個minxins吧。

/** form-id-mixins.js **/
export default {
  methods: {
    getFormIdData(formId, type = 1) {
        // 加type引數是為了有效區分都為同一型別的formId
        const params = {
          formId,
          type
        }
        // 傳值給後臺的API
        Api.getFormId(params)
          .then(res => {
            console.log('success')
          })
    },
  }
}
複製程式碼

引用就簡單了...

import mixin from '@/form-id-mixins.js'
export default {
  mixins: [mixin],
  methods: {
    handlePush(e) {
      this.getFormIdData(e.detail.formId)
    } 
  }
}
複製程式碼

相關文章