reactjs - react-share 参数 'href' 应该代表一个有效的 URL

Question

我正在使用 react-share 包对我的网页进行社交分享，但在 FacebookShare 按钮中显示错误，例如“参数‘href’应该代表一个有效的 URL”

我的 Share.js 代码是：-

import React from 'react'
import {
  FacebookShareButton,
  FacebookIcon,
  TwitterShareButton,
  TwitterIcon,
  WhatsappShareButton,
  WhatsappIcon,
} from 'react-share'

const ShareButtons = ({title, url}) => {

    return(
        <div>
        <WhatsappShareButton url={url} title={title}className="share-btn">
           <WhatsappIcon  size={40} round={true}/>
        </WhatsappShareButton>
        <FacebookShareButton url={url} title={title}  className="share-btn">
            <FacebookIcon  size={40} round={true}/>
        </FacebookShareButton>

        <TwitterShareButton url={url} title={title} className="share-btn">
            <TwitterIcon  size={40} round={true} />
         </TwitterShareButton>

    </div>
  )

}
export default ShareButtons

在我的页面中：-

<ShareButtons title={this.state.package.title} url={window.location.href}/>

Answer 1

如果您使用的是 localhost，则会发生这种情况，尝试使用 172.0.0.1 之类的 IP 地址或仅使用您的 IP 地址，您应该得到这样的 url

  let url = '';
  if (typeof window === 'object') {
    url = String(window.location);
    console.log(url);
  }