I. Requirements description

  1. Click the button to share a link to a promotional page with friends
  2. This link needs to take parameters that identify who the promoter is
  3. Set the image to share the link

Second, demand realization

2.1 Sharing links

  1. Add button label, use the open capability provided by wechat, and set the open-type attribute to share
<button open-type="share"</button>Copy the code

Attach an acceptable attribute value for open-type:

  1. When the user clicks the button, the onShareAppMessage event is raised, and an object containing the shared page path is returned in this handler:
Page({
    onShareAppMessage() {
        return {
            path: '/pages/examplePage'}}})Copy the code

2.2 Link Tape Parameters

Spelling parameters directly on a path:

Page({
    onShareAppMessage() {
        return {
            path: '/pages/examplePage? flag=1'}}})Copy the code

2.3 Set images for sharing links

When you return an object, you can configure some properties, such as forwarding title, linking image, etc. :

Page({
    onShareAppMessage() {
        return {
            title: 'sharing',
            path: '/pages/examplePage? flag=1' ,
            imageUrl: '/images/share_icon.png'}}})Copy the code

Attached is a list of configured properties:

< About us >

We are one front-end programmer monkey + one front-end programmer girl from the imperial capital.

The articles posted here are a summary of what we have learned and are expected to be updated at least once a week.

At present our learning plan is: small program actual combat => VUE advanced usage => VUE principle => CSS foundation => ES6 => JS in-depth

In addition, some of the technologies and functions used in the work will be summarized and updated here in time

If the article is wrong or not clear, welcome to leave a message feedback ~~