首页 > 解决方案 > 将 onCenter={} 设置添加到 react-native-image-pan-zoom 会触发语法错误

问题描述

这个包在一般情况下工作得很好。但是当我添加 onCenter 参数时,Android 应用程序模拟器会因语法错误而崩溃。

我的图像文件高于手机屏幕尺寸。默认似乎是它显示图像的中心。我正在尝试显示图像的顶部。用户可以上下滑动来阅读图像的其余部分。我按照此页面上的说明进行操作。 https://www.npmjs.com/package/react-native-image-pan-zoom

我已经尝试过“centerOn”和“ICenterOn”,结果相同。

<View>
<ImageZoom 
      cropWidth={Dimensions.get('window').width}
       cropHeight={Dimensions.get('window').height - 90}
       imageWidth={750}
       imageHeight={2175}
       pinchToZoom={true} 
      enableCenterFocus={false}
      centerOn={x: 100, y: 100, scale: 1, duration: 0.1}
               >
        <Image style={styles.map3}
               source={require('./assets/imageFile_01.png')}> . 
        </Image>
</ImageZoom>
</View>

语法错误似乎表明此方法未被识别。任何指针将不胜感激。

我的环境:Mac OS 10.14 React:16.6.3 React Native:0.58.4 react-native-image-pan-zoom:^2.1.11正在Android模拟器上测试

看起来这个工具也被称为 react-native-image-zoom。

https://github.com/ascoders/react-native-image-zoom

标签: androidreact-native

解决方案


我有同样的问题,通过将 centerOn 作为对象(双括号)传递来修复它:

centerOn={{x: 100, y: 100, scale: 1, duration: 0.1}}

推荐阅读