Cloned2Preserve
/
qrbtf
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

GA for zoom

This commit is contained in:
CPunisher 2020-07-01 23:22:32 +08:00
parent 36938d34b4
commit 622712cb4a
2 changed files with 17 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/app/PartMore.js
View File

@ -8,7 +8,7 @@ import LinkButton from "../link/LinkButton";
import ImageZoom from "../../containers/app/ImageZoom"; import ImageZoom from "../../containers/app/ImageZoom";
import LinkTrace from "../link/LinkTrace"; import LinkTrace from "../link/LinkTrace";
import {isPC} from "../../utils/navigatorUtils"; import {isPC} from "../../utils/navigatorUtils";
import {handleScroll} from "../../utils/gaHelper"; import {handleScroll, handleZoom} from "../../utils/gaHelper";
const pictures = [ const pictures = [
'https://7172-qrbtf-1d845d-1255694434.tcb.qcloud.la/QrbtfGallery/gallery04.jpg', 'https://7172-qrbtf-1d845d-1255694434.tcb.qcloud.la/QrbtfGallery/gallery04.jpg',
@ -103,11 +103,14 @@ const PartMore = () => {
} }
const Gallery = ({ contents }) => { const Gallery = ({ contents }) => {
const zoom = React.useRef(mediumZoom()); const zoom = mediumZoom();
const zoomRef = React.useRef(zoom);
zoom.on('open', event => {handleZoom(event.target.src)})
return ( return (
contents.map((url) => ( contents.map((url, index) => (
<LazyLoad offsetVertical={200}> <LazyLoad key={'lazy_gallery_' + index} offsetVertical={200}>
<ImageZoom zoom={zoom.current} background={"rgba(0, 0, 0, 0.8)"} className="Qr-gallery-image" src={url}/> <ImageZoom key={'gallery_' + index} zoom={zoomRef.current} background={"rgba(0, 0, 0, 0.8)"} className="Qr-gallery-image" src={url}/>
</LazyLoad> </LazyLoad>
) )
) )

10
src/utils/gaHelper.js
View File

@ -57,7 +57,15 @@ export function handleInputUrl() {
export function handleScroll(label) { export function handleScroll(label) {
ReactGA.event({ ReactGA.event({
category: 'ScrollContainer', category: 'ScrollContainer',
action: 'scroll', action: 'Scroll',
label: label label: label
}); });
} }
export function handleZoom(url) {
ReactGA.event({
category: 'Image',
action: 'Zoom',
label: url
});
}