share ดาวน์โหลด - share การดาวน์โหลดซอร์สโค้ด

share

โค้ดแหล่งที่มา AI

1.0.0

ดาวน์โหลด

มินิแชร์

องค์ประกอบการแชร์แอปเพล็ต WeChat สามารถออกแบบด้วยภาพและส่งออกเป็น json เพื่อสร้างเทมเพลตโปสเตอร์การแชร์

แม้ว่าปัจจุบันจะมีอินเทอร์เฟซสำหรับตรวจสอบพฤติกรรมของปุ่ม "แชร์ไปยังช่วงเวลา" ในเมนูมุมขวาบน (เวอร์ชันเบต้า ซึ่งปัจจุบันรองรับบนแพลตฟอร์ม Android เท่านั้น) แต่ก็มีข้อจำกัดมากมาย การแชร์โดยใช้รูปภาพยังเป็นวิธีที่ดีกว่าในการข้ามมิตรภาพและแพลตฟอร์มต่างๆ

การแสดงเอฟเฟกต์

วิธีใช้

รับส่วนประกอบ

 git clone https://github.com/MakerGYT/share.git

แนะนำส่วนประกอบ

└── components
    ├── painter
    └── share

คัดลอกการแชร์และตัวลงสีไปยังโฟลเดอร์ส่วนประกอบ และแนะนำส่วนประกอบนี้ผ่านไฟล์การกำหนดค่า:

{
  "usingComponents" :{
    "share" : " /components/share/share "
  }
}

ใช้ส่วนประกอบ

 <!-- index.wxml -->
< button bindtap =" toShare " type =" primary " >分享</ button >
< share show =" {{shareShow}} " bind:setPoster =" toMoments " palette =" {{palette}} " > </ share >

 // index.js
import Poster from 'poster.js' ;
Page ( {
  data : {
    shareShow : false
  } ,
  toShare : function ( e ) {
    this . setData ( {
      shareShow : true
    } )
  } ,
  toMoments : function ( ) {
    this . setData ( {
      palette : new Poster ( params ) . palette ( )
    } )
  } ,
} )

ไฟล์เทมเพลตโปสเตอร์ถูกวาดโดยใช้เครื่องมือและบันทึกลงใน poster.js

 // poster.js
export default class Poster {
  constructor ( params ) {
    this . params = params ;
  }
  palette ( ) {
    return ( {
      ...
    } )
  }
}

เคล็ดลับ :

หากมีการเรียกคอมโพเนนต์บนหน้า Tab เนื่องจาก Tabbar ที่ด้านล่างมีระดับที่สูงกว่าและโปสเตอร์ยาวกว่า ส่วนประกอบนั้นจะถูกบดบัง คุณสามารถควบคุมการมองเห็นของ Tabbar ผ่านสถานะเหตุการณ์ showPoster และ closePoster
หน่วยมิติรองรับ rpx
ไฟล์เทมเพลตโปสเตอร์สามารถทำให้ง่ายขึ้นและบีบอัดได้โดยการแยกสไตล์ทั่วไปออก

รายการทรัพย์สิน

คุณสมบัติ	พิมพ์	ค่าเริ่มต้น	ที่จำเป็น	แสดงให้เห็น
แสดง	บูลีน	เท็จ	ใช่	ไม่ว่าจะแสดง
จานสี	วัตถุ		ใช่	แหล่งข้อมูลโปสเตอร์
หน้ากาก	บูลีน	จริง	เลขที่	จะแสดงมาสก์พื้นหลังหรือไม่
หน้ากากปิดได้	บูลีน	เท็จ	เลขที่	สามารถปิดมาสก์พื้นหลังได้โดยคลิกที่มันได้หรือไม่
ผูก: setPoster	ตัวจัดการเหตุการณ์		ใช่	เหตุการณ์เกิดขึ้นเมื่อคลิกเพื่อแชร์ไปยัง Moments โดยทั่วไปจะใช้เพื่อสร้างและส่งผ่านข้อมูลโปสเตอร์ที่สร้างอินสแตนซ์
ผูก:showPoster	ตัวจัดการเหตุการณ์		เลขที่	เหตุการณ์ที่เกิดขึ้นหลังจากสร้างโปสเตอร์ event.detail = {path}
ผูก: closePoster	ตัวจัดการเหตุการณ์		เลขที่	เหตุการณ์เกิดขึ้นหลังจากปิดโปสเตอร์ event.detail = {บันทึก}