>위챗 애플릿 >미니 프로그램 개발 >위챗 미니 프로그램 친구에게 전달 기능

위챗 미니 프로그램 친구에게 전달 기능

hzc
hzc앞으로
2020-06-28 10:03:033725검색

오늘은 WeChat 애플릿의 전달 기능에 대해 간략하게 설명하겠습니다. 주로 친구나 그룹에 전달하는 것에 대해 이야기하기 때문에 좀 더 복잡합니다. 먼저 조금 공개하겠습니다. 모멘트에 공유하는 방법에는 크게 두 가지가 있는데, 하나는 배경에서 직접 포스터 이미지를 생성하는 것이고, 다른 하나는 프런트 엔드에서 캔버스를 통해 포스터를 생성하는 것입니다. 나중에 기회가 되면 자세히 이야기하겠습니다. 그럼 본론으로 돌아가서 전달하는 친구들에 대해 계속 이야기해 보겠습니다.

먼저 WeChat 애플릿의 API를 소개합니다: onShareAppMessage(옵션)

페이지의 전달 정보를 설정하려면 페이지에서 onShareAppMessage 함수를 정의하세요.

  • 이 이벤트 핸들러가 정의된 경우에만 오른쪽 상단 메뉴에 "앞으로" 버튼이 표시됩니다.

  • 사용자가 앞으로 버튼을 클릭하면 호출됩니다.

  • 이 이벤트는 반환되어야 합니다. 사용자 정의 전달을 위한 객체 Content

options 매개변수 설명

Parameter Type Description 최소 버전
from String 이벤트 소스를 전달합니다. 버튼: 페이지 내 전달 버튼; 메뉴: 오른쪽 상단에 있는 전달 메뉴 1.2.4
target Object from 값이 버튼인 경우 대상은 이 전달 이벤트를 트리거한 버튼입니다. 그렇지 않으면 정의되지 않습니다 1.2.4

사용자 정의 전달 필드

field description 기본값 최소 버전
제목 제목 전달 현재 미니 프로그램 name
path 전달 경로 현재 페이지 경로는 /
imageUrl 사용자 정의 이미지 경로(로컬 파일 경로, 코드)로 시작하는 전체 경로여야 합니다. 패키지 파일 경로 또는 네트워크 이미지 경로는 PNG 및 JPG를 지원합니다. imageUrl이 전달되지 않으면 기본 스크린샷이 사용됩니다. 디스플레이 이미지 화면 비율은 5:4
1.5.0
success 성공적인 전달을 위한 콜백 함수
1.0
fail 호출 실패한 전달을 위해 뒤로 기능 조정
1.1.0
complete 포워딩 종료 시 콜백 함수(포워딩 성공 또는 실패 시 실행됨
1.1.0

shareTick이라는 또 다른 값이 있습니다. 전달은 성공적으로 반환되었으며 배열이며, 각 항목은 전달 객체에 해당하는 shareTicket입니다.

API가 이에 대해 먼저 설명하고 구현이 있습니다. of forwarding

그림을 먼저 보세요:

우선 onLoad에서 wx.showShareMenu

  onLoad: function (e) {
    wx.showShareMenu({
      // 要求小程序返回分享目标信息
      withShareTicket: true
    }); 
  },

를 구성한 다음 onShareAppMessage

/* 转发*/
  onShareAppMessage: function (ops) {    if (ops.from === 'button') {
      // 来自页面内转发按钮
      console.log(ops.target)
    }    return {
      title: '转发dom',
      path: `pages/index/index`,
      success: function (res) {
        // 转发成功
        console.log("转发成功:" + JSON.stringify(res));
        var shareTickets = res.shareTickets;
        // if (shareTickets.length == 0) {
        //   return false;
        // }
        // //可以获取群组信息
        // wx.getShareInfo({
        //   shareTicket: shareTickets[0],
        //   success: function (res) {
        //     console.log(res)
        //   }
        // })
      },
      fail: function (res) {
        // 转发失败
        console.log("转发失败:" + JSON.stringify(res));
      }
    }
  },

를 구성하여 전달 세부 정보를 얻으려면 wx.getShareInfo를 설명하겠습니다

전체 js 코드는

//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    motto: 'Hello World',
  },
  onLoad: function (e) {
    wx.showShareMenu({
      // 要求小程序返回分享目标信息
      withShareTicket: true
    }); 
  },
  /* 转发*/
  onShareAppMessage: function (ops) {    if (ops.from === 'button') {
      // 来自页面内转发按钮
      console.log(ops.target)
    }    return {
      title: '转发dom',
      path: `pages/index/index`,
      success: function (res) {
        // 转发成功
        console.log("转发成功:" + JSON.stringify(res));
        var shareTickets = res.shareTickets;
        // if (shareTickets.length == 0) {
        //   return false;
        // }
        // //可以获取群组信息
        // wx.getShareInfo({
        //   shareTicket: shareTickets[0],
        //   success: function (res) {
        //     console.log(res)
        //   }
        // })
      },
      fail: function (res) {
        // 转发失败
        console.log("转发失败:" + JSON.stringify(res));
      }
    }
  },
})

똑똑한 학생들은 다음 단계가 wxml 코드라는 것을 알아야 합니다.

<view class="container">
  <view class="userinfo">
   <button open-type="share">分享好友</button>
  </view>
  <view class="usermotto">
    <text class="user-motto">{{motto}}</text>
  </view>
</view>

공유하려면 버튼을 클릭하면 버튼을 open-type="share"로 설정해야 합니다. 그렇지 않으면 공유되지 않습니다.

글이 유익하고 도움이 되었다고 생각하시면 친구들과 공유해 주세요. 이해가 안 되는 부분이 있으면 아래에 메시지를 남겨주세요.

추천 튜토리얼: "WeChat Mini. 프로그램"

위 내용은 위챗 미니 프로그램 친구에게 전달 기능의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 juejin.cn에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제