diff --git a/examples/components/Form/Static.jsx b/examples/components/Form/Static.jsx index 6346c8d1f..297554225 100644 --- a/examples/components/Form/Static.jsx +++ b/examples/components/Form/Static.jsx @@ -134,6 +134,7 @@ export default { title: '233', imageCaption: 'jfe fjkda fejfkda fejk fdajf dajfe jfkda', enlargeAble: true, + showToolbar: true, originalSrc: '${image}' }, @@ -144,6 +145,7 @@ export default { thumbMode: 'cover', thumbRatio: '4:3', enlargeAble: true, + showToolbar: true, originalSrc: '${src}' // 注意这个取变量是想对数组成员取的。 }, diff --git a/packages/amis-ui/src/components/ImageGallery.tsx b/packages/amis-ui/src/components/ImageGallery.tsx index 8a0fb1d68..b56560d40 100644 --- a/packages/amis-ui/src/components/ImageGallery.tsx +++ b/packages/amis-ui/src/components/ImageGallery.tsx @@ -90,16 +90,21 @@ export class ImageGallery extends React.Component< actions: ImageGallery.defaultProps.actions }; - componentDidMount() { - window.addEventListener('wheel', this.onWheelScroll.bind(this), { - passive: false - }); - } - - componentWillUnmount() { - window.removeEventListener('wheel', this.onWheelScroll); + galleryMain?: HTMLDivElement; + @autobind + galleryMainRef(ref: HTMLDivElement) { + if (ref) { + ref.addEventListener('wheel', this.onWheelScroll, { + passive: false + }); + } else { + this.galleryMain?.removeEventListener('wheel', this.onWheelScroll); + } + + this.galleryMain = ref; } + @autobind onWheelScroll(event: WheelEvent) { const showToolbar = this.state?.showToolbar; @@ -290,7 +295,10 @@ export class ImageGallery extends React.Component<