taro 设置右上角省略号分享、分享到朋友圈、分享群聊获取更多消息、收藏

悠悠 2021-07-24 20:39 853阅读 0赞

分享:
    	在要分享的页面的js文件中设置：
    	 onShareAppMessage:function(from,target,webViewUrl)
    	  {
    		参数:
    			from 	转发事件来源。button：页面内转发按钮；menu：右上角转发菜单 	
    			target 	如果 from 值是 button，则 target 是触发这次转发事件的 button，否则为 undefined 
    			webViewUrl 页面中包含web-view组件时，返回当前web-view的url 	
    		
    	    return{
    	      title:'点击转发后,页面文章的标题',
    	      path: "/pages/news/news-detail/news-detail"
    		  imageUrl:'本地文件路径、代码包文件路径或者网络图片路径。支持PNG及JPG'
    		  	不写默认为当前页面截图
    	    }
    	  }
    	其中:
    		该函数与data同级
    		path的默认路径为根路径,即src开始
    		path:'/必要要以/开头,放置要分析页面的文件路径,可根据app.json内的配置信息设置'
    
    点击按钮分享:
    	button 组件设置属性 openType="share"，可以在用户点击按钮后触发 Page.onShareAppMessage
    
    分享到朋友圈:
    	必须先定义onShareAppMessage,定义该回调,点击右上角分享,才会显示
    	
    	onShareTimeline(){
    		return{
    			title:自定义标题，即朋友圈列表页上显示的标题 	当前小程序名称 	
    			query:自定义页面路径中携带的参数，如 path?a=1&b=2 的 “?” 后面部分 	当前页面路径携带的参数 	
    			imageUrl:自定义图片路径，可以是本地文件或者网络图片。支持 PNG 及 JPG，显示图片长宽比是 1:1。 	默认使用小程序 Logo 	
    
    		}
    	}
    	
    分享到群聊获取更多信息:
    	Taro.showShareMenu 并且设置 withShareTicket 为 true ，当用户将小程序转发到任一群聊之后，此转发卡片在群聊中被其他用户打开时，
    	可以在 App.onLaunch 或 App.onShow 获取到一个 shareTicket。通过调用 Taro.getShareInfo 接口传入此 shareTicket 可以获取到转发信息。
    
    收藏:
    
    	onAddToFavorites(webviewUrl) {	页面中包含web-view组件时，返回当前web-view的url
    
    	    return {
    	      title: '自定义标题',
    	      imageUrl: 'http://demo.png',
    	      query: 'name=xxx&age=xxx',
        }
      }

代码示例:

import Taro from '@tarojs/taro'
    import { View,Text,Button,Image} from '@tarojs/components'
    import React,{ Component} from 'react'
    
    import { add } from '../../utils/db/index'
    
    class Game extends Component{    
    
        state={ 
            imgs:[],
            cloudImgs:[],
            fileID:''
        }
    
        _hideShareMenu=()=>{ 
            Taro.hideShareMenu({ 
                success()
                { 
                    console.log('ww');
                },
                fail()
                { 
                    console.log('dd')
                }
            });
            wx.hideShareMenu();
        }
        
        onShareTimeline(){ 
            return{ 
           	
                title:'分享',
    
            }
        }
        
         onShareAppMessage()
         { 
             return{ 
                 title:'点击转发后,页面文章的标题',
             }
         }
        render()
        { 
    
    
            return(
    
                <View>
                    <Button  openType='share'>转发</Button>
    
                </View>
            )
        }
    }
    
    export default Game