Analysis of usage of WeChat mini program sharing function onShareAppMessage(options)

This article describes the usage of onShareAppMessage(options) of WeChat applet sharing function. Share it for your reference, as follows:

When the onShareAppMessage function is defined in the page's js file, the page can indicate that the page can be forwarded. You can set the information for page forwarding in the function.

1. Only when this function is defined will there be a forwarding button in the menu in the upper right corner of the applet

2. Call the function when the user clicks the forward button

3. Required within this functionreturn An Object containing forwarded information (custom forwarded content)

There are two places on the page where forwarding time can be triggered:

One is the forwarding button in the menu in the upper right corner
Another one is that there are attributes in the pageopen-typeAnd its value is the share button. (Note: It must be a button component, and it is set in other componentsopen-type="share"invalid)
Right now:

<button data-name="shareBtn" open-type="share">Forward</button>

Note: In actual development, you will find that this button comes with a style. When the background color is set to white, there is also a black border. At first, the border cannot be removed, but later a style attribute was added to the button.plain="true"Later, control the style in the style filebutton[plain]{ border:0 }, you can compare the random custom styles, such as making the share button into an icon, etc.

Functions called after triggering the sharing event:

onShareAppMessage: function( options ){
  var that = this;
  // Forward content when the forwarding button in the settings menu triggers the forwarding event  var shareObj = {
    title: "Title of forward",    // The default is the name of the applet (you can write slogan, etc.)    path: '/pages/share/share',    // The default is the current page, and it must be the full path starting with '/'    imageUrl: '',   //Custom image path, which can be local file path, code package file path or network image path. It supports PNG and JPG. If imageUrl is not passed in, the default screenshot will be used.  The aspect ratio of the picture is 5:4    success: function(res){
      // Callback after successful forwarding      if( == 'shareAppMessage:ok'){
      }
    },
    fail: function(){
      // Callback after forwarding failure      if( == 'shareAppMessage:fail cancel'){
        // User cancels forwarding      }else if( == 'shareAppMessage:fail'){
        // Forwarding failed, where detailed message is the detailed failure information      }
    },
    complete: fucntion(){
      // Callback after forwarding (if forwarding is not successful, it will be executed)    }
  };
  // Forwarding from buttons in the page  if(  == 'button' ){
    var eData = ;
    (  );   // shareBtn
    // Here you can modify the content in shareObj     = '/pages/btnname/btnname?btn_name='+;
  }
  // Return to shareObj  return shareObj;
}

I hope this article will be helpful to everyone’s WeChat mini program development.