React native 拍照后在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

我正在尝试拍摄一张照片,然后在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 = 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}
              />

在解决了我的问题后,我现在正在分享这篇文章