How to realize the forwarding/sharing function of WeChat Mini Program

In the development of WeChat applets, we often encounter the need to forward the current page to friends. And most of the time, the forwarded pages are with parameters. There are still many pits in it.

  <button open-type="share" type="primary">
  分享给好友
  </button>

First, let's write a button button. An important point is the open-type attribute of the button button. This must be written as share.
In fact, the actual principle of this is to trigger the life cycle function of onShareAppMessage through the button.

  onShareAppMessage: function (res) {
    
    
    var that = this;
    console.log(JSON.stringify(that.data.array))
    return {
    
    
      title:that.data.array.name,
      path:'pages/detail/detail?array=' + JSON.stringify(that.data.array),
      imageUrl:that.data.array.pic
    }
  }
})

The most important thing is to return an object, the core is three attributes, title, path, imageUrl
Insert picture description here
title is the title, path is the page path to jump after clicking, imageUrl is the displayed image.
This path supports parameter passing, because most of the requirements require parameters.

My small program is a small recipe program. The user sees a satisfactory dish and wants to share it with friends. After the friend clicks on the link to enter, he must jump to the dish I saw, so this demand must be Realized by url passing parameters.

By the way, make an advertisement, I recently developed a small recipe recipe program, currently more than 10,000 dishes are displayed, welcome to experience.
Insert picture description here

The above can achieve the expected function, and can accurately jump to the forwarded page.
Insert picture description here


There is a WeChat mini program course design, complete design needs, contact personal QQ: 505417246

Pay attention to the following WeChat public account, you can receive WeChat applet, Vue, TypeScript, front-end, uni-app, full stack, Nodejs, Python and other practical learning materials. The
latest and most complete front-end knowledge summary and project source code will be released to the WeChat public as soon as possible No., please pay attention, thank you!

Insert picture description here

Guess you like

Origin blog.csdn.net/m0_46171043/article/details/112547619