将react-share与react-image-lightbox一起使用
将react-share与react-image-lightbox一起使用
提问于 2018-05-30 05:34:21
我接管了一个React项目，正在笨拙地将react-share与react-image-lightbox结合起来。我对React和Typescript都不太熟悉，所以任何见解都非常感谢。
下面是相关的代码片段：
import {
FacebookShareButton,
GooglePlusShareButton,
LinkedinShareButton,
TwitterShareButton,
EmailShareButton,
} from 'react-share'
const Lightbox = require('react-image-lightbox')
render() {
return(
<Lightbox
...
toolbarButtons={['Facebook share button?', 'Twitter share button?']}
...
onCloseRequest={this.handleCloseViewer}
onMovePrevRequest={this.handleViewPrev}
onMoveNextRequest={this.handleViewNext}
/>
)
}回答 1
Stack Overflow用户
发布于 2018-05-31 07:10:47
解决了：这是工作片段。
import {
FacebookShareButton,
GooglePlusShareButton,
LinkedinShareButton,
TwitterShareButton,
EmailShareButton,
} from 'react-share'
import {
FacebookIcon,
TwitterIcon,
PinterestIcon,
EmailIcon
} from 'react-share';
const Lightbox = require('react-image-lightbox')
render() {
return(
<Lightbox
...
toolbarButtons={[
<FacebookShareButton url={window.location.href} children={<FacebookIcon size={32} round={true} />} />,
<TwitterShareButton url={window.location.href} children={<TwitterIcon size={32} round={true} />} />,
<PinterestShareButton url={window.location.href} children={<PinterestIcon size={32} round={true} />} />,
<EmailShareButton url={window.location.href} children={<EmailIcon size={32} round={true} />} />
]}
...
onCloseRequest={this.handleCloseViewer}
onMovePrevRequest={this.handleViewPrev}
onMoveNextRequest={this.handleViewNext}
/>
)
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50593304
复制相关文章
相似问题
腾讯云开发者
