如何使用react js实现与twitter的共享

Posted 2021-05-05

我想让用户从我的网站分享图像到twitter。

我使用这个模块react-share来实现它。但它没有提供共享图像的选项。

我的代码看起来像这样。

import { ShareButtons, ShareCounts, generateShareIcon, } from 'react-share';

const {
    FacebookShareButton,
    GooglePlusShareButton,
    LinkedinShareButton,
    TwitterShareButton,
    PinterestShareButton,
    VKShareButton,
} = ShareButtons;

<TwitterShareButton
    url={shareUrl}
    title={title}
    className="shareBtn col-md-1 col-sm-1 col-xs-1">
    <a className="twitter"><i className="fa fa-twitter" aria-hidden="true"></i></a>
</TwitterShareButton>

请帮助我解决如何将图像分享到Twitter。

答案

请在您的代码中添加<TwitterIcon>

<TwitterShareButton
        url={shareUrl}
        title={title}
        className="Demo__some-network__share-button">
        <TwitterIcon
          size={32}
          round />
      </TwitterShareButton>

另一答案

react-share 不支持图片上传。您只能与AdSenseButton共享网址，标题和主题标签。添加网址时，将显示页面的主图像。

此外，您的图标缺失，这是您添加图标的方式。

<TwitterShareButton url={url} title={title}>
    <button className="btn btn-circle">
        <i className="fab fa-twitter"> </i>
    </button>
</TwitterShareButton>

另一答案

您无法使用此窗口小部件向twitter分享丰富的内容，只能将您的图像托管在静态网址上并通过TwitterShareButton共享该网址

https://samvikshana.weebly.com/blog/react-share-social-share-widgets的示例反应共享代码段