共享时不显示反应共享图像

时间:2018-12-23 14:47:53

标签: reactjs

在我所有的共享按钮中,我的图像不仅仅显示网址

在我的公用文件夹html标头中

std::vector

在我的详细信息组件中,我正在使用react-helmet t动态地将标题放置在共享按钮上。

    <meta content="`%PUBLIC_URL%/${picture.jpg}`">
    <meta property="og:description" content='' />

头盔组件

  render() { 
    const { project, auth } = this.props;
    const shareUrl = window.location.href; 
    const articleId = this.props.match.params.id; 
    const {pathname} = this.props.location;
    const imageURL = '';

    if (project) {

      return (
        <div className="container">

当我分享到Facebook时,我会得到

由于抗议者与警察发生冲突,苏丹有8人丧生https://firebasestorage.googleapis.com/v0/b/dsdnewsapi.appspot.com/o/projectPics%2F824b9ec1-e708-455e-acce-9bbd40d2b24a.JPG?alt=media&token=137f1738-5cc3-4596-8373-d74f6699799a

仅显示图片网址,但未显示图片。

          <Helmet>
              <meta charSet="utf-8" />
              <title>{project.title}</title>
              <meta property="og:url" content={`https://l.facebook.com/l.php?u=https%3A%2F%2F${shareUrl?shareUrl:''}`} />
              <meta property="og:description" content={project.title} />
              <meta property="og:image" content={imageURL!==''?`${project.pictureUrl}`: ''} />
              <meta property="fb:app_id" content="198985484382564" />
          </Helmet>

Google plus是 https://plus.google.com/up/?continue=https://plus.google.com/share?url%3Dhttps://dsdnews.de/project/xLJZmsOUZTI00Z7bmblo

            <FacebookShareButton
              url={shareUrl}
              imageURL={project.pictureUrl}
              quote={project.title} 
              className="m-2">
              <FacebookIcon size={32} round={true} />
            </FacebookShareButton>

对于Twitter来说,这就是

最新消息... BUHARI`S 76生日并邀请SAGA。 https://firebasestorage.googleapis.com/v0/b/dsdnewsapi.appspot.com/o/projectPics%2Ff862995d-f93f-4684-8ad4-52e2fde6324c.png?alt=media&token=287de96d-b2b8-4c7d-a327-5143f7ad4ac5

https://dsdnews.de/project/xLJZmsOUZTI00Z7bmblo

            <GooglePlusShareButton
              url={shareUrl}
              title={project.title}
              media={project.pictureUrl}
              className="m-2">
              <GooglePlusIcon size={32} round={true} />
            </GooglePlusShareButton>

什么是

最新消息... BUHARI`S 76生日并邀请SAGA。 https://firebasestorage.googleapis.com/v0/b/dsdnewsapi.appspot.com/o/projectPics%2Ff862995d-f93f-4684-8ad4-52e2fde6324c.png?alt=media&token=287de96d-b2b8-4c7d-a327-5143f7ad4ac5

https://dsdnews.de/project/xLJZmsOUZTI00Z7bmblo

            <TwitterShareButton
              url={shareUrl}
              title={`${project.title} ${project.pictureUrl}`}
              media={project.pictureUrl}
              className="m-2">
              <TwitterIcon size={32} round={true} />
            </TwitterShareButton>

1 个答案:

答案 0 :(得分:-1)

您已将imageURL传递到了组件,但您正在阅读pictureUrl来显示它们。