React native 拍照后在facebook上共享-不在facebook上显示图像
我正在尝试拍摄一张照片,然后在facebook上分享。虽然照片有时没有显示出来React native 拍照后在facebook上共享-不在facebook上显示图像,react-native,react-native-view-shot,React Native,React Native View Shot,我正在尝试拍摄一张照片,然后在facebook上分享。虽然照片有时没有显示出来 import Share from 'react-native-share'; import ViewShot from 'react-native-view-shot'; class ShareOptions extends PureComponent { constructor(props) { super(props); this.state = {}; } onCapture
import Share from 'react-native-share';
import ViewShot from 'react-native-view-shot';
class ShareOptions extends PureComponent {
constructor(props) {
super(props);
this.state = {};
}
onCapture = uri => {
const { navigation } = this.props;
const item = get(navigation.state.params, 'itemInfo', {});
const appId = get(navigation.state.params, 'appId', '');
const message = item.title;
const shareOptions = {
title: 'Share via',
message: `${message} ${item.link}`,
social: Share.Social[appId],
url: uri,
};
if (appId === 'MESSENGER') {
Share.open(shareOptions);
} else if (appId === 'TELEGRAM') {
Share.open(shareOptions);
} else if (appId === 'WHATSAPP') {
Linking.openURL(`whatsapp://send?text=${`${message} ${item.link}`}`);
} else if (appId === 'MORE') {
Share.open(shareOptions);
} else {
Share.shareSingle(shareOptions);
}
};
render() {
const { navigation } = this.props;
const item = get(navigation.state.params, 'itemInfo', {});
return (
<View bg="white">
<ViewShot
style={{ backgroundColor: '#fff' }}
onCapture={this.onCapture}
captureMode="mount"
options={{ format: 'png' }}
f={1}>
<View
w={Environment.screenWidth - 40}
h={Environment.screenHeight - 150}
bg="white"
br={5}
e={8}
m={20}
jc="space-between">
<View>
{get(item, 'url', '') !== '' && (
<View>
<FastImage
style={{
height: 150,
resizeMode: 'cover',
borderRadius: 0,
}}
source={{
uri: item.url,
priority: FastImage.priority.normal,
}}
resizeMode={FastImage.resizeMode.cover}
/>
</View>
)}
<View ph={10} pt={get(item, 'url', '') !== '' ? 12 : 2}>
<Text fs={14} lh={19} c={Color.black} sb numberOfLines={2}>
{item.title}
</Text>
<Text
fs={12}
lh={17}
c={Color.black}
numberOfLines={get(item, 'url', '') !== '' ? 8 : 16}
mt={5}>
{item.description}
</Text>
</View>
</View>
<View ph={11} pt={25} pb={11.5} row ai="center">
<Icon
type="MaterialCommunityIcons"
name="newspaper"
size={22}
color={Color.light}
/>
<Text ml={8} c={Color.light} fs={14}>
{item.author}
</Text>
</View>
<View
h={2}
w={Environment.screenWidth - 60}
bg={Color.grey65}
as="center"
mv={2}
/>
<View row ai="center" ph={11} pt={10} pb={15}>
<Image
style={{
resizeMode: 'contain',
height: 18,
width: 64,
}}
source={require('../../../assets/images/flockby-name.png')}
/>
<Text ph={8} fs={12}>
Celebrate wildlife - Chat, meet, share!
</Text>
</View>
</View>
</ViewShot>
<View m={20}>
<Text c={Color.light} fs={12} br={5} e={3} m={4}>
Read story at {item.link}
</Text>
</View>
</View>
);
}
}
export default ShareOptions;
从“反应本机共享”导入共享;
从“反应本机视图快照”导入视图快照;
类ShareOptions扩展了PureComponent{
建造师(道具){
超级(道具);
this.state={};
}
onCapture=uri=>{
const{navigation}=this.props;
const item=get(navigation.state.params,'itemInfo',{});
const appId=get(navigation.state.params,'appId','';
const message=item.title;
常量共享选项={
标题:“通过共享”,
消息:`${message}${item.link}`,
社交:Share.social[appId],
url:uri,
};
如果(appId==='MESSENGER'){
公开(股票期权);
}else if(appId===‘电报’){
公开(股票期权);
}else if(appId=='WHATSAPP'){
Linking.openURL(`whatsapp://send?text=${`${message}${item.link}``);
}else if(appId==='MORE'){
公开(股票期权);
}否则{
Share.shareSingle(股票期权);
}
};
render(){
const{navigation}=this.props;
const item=get(navigation.state.params,'itemInfo',{});
返回(
{get(项,'url','')!='&&(
)}
{item.title}
{item.description}
{item.author}
庆祝野生动物——聊天、见面、分享!
阅读{item.link}上的故事
);
}
}
导出默认共享选项;
编辑:因此它第一次显示图像,但连续几次不起作用
所以我实现了下面的命令,让它等待我的图片上传
<FastImage
onLoad={this.onImageLoad}
style={{
height: 150,
resizeMode: 'cover',
borderRadius: 0,
}}
source={{
uri: item.url,
priority: FastImage.priority.normal,
}}
resizeMode={FastImage.resizeMode.cover}
/>
然而,有时我无法从后端获取图像url
请帮助新手反应本族语自己修复
<FastImage
onLoad={this.onImageLoad}
style={{
height: 150,
resizeMode: 'cover',
borderTopLeftRadius: 5,
borderTopRightRadius: 5,
}}
source={{
uri: item.url,
priority: FastImage.priority.normal,
}}
resizeMode={FastImage.resizeMode.cover}
/>
在解决了我的问题后,我现在正在分享这篇文章