使用react-native-image-modal示例报source属性不存在于IntrinsicAttributes错误
错误原因
这个错误出现的核心原因是react-native-image-modal组件本身不提供source属性,该组件的设计逻辑是将标准React Native Image组件作为子元素传入,图片资源相关的source属性需要绑定到内部的Image组件上,而非直接传给ImageModal。
解决步骤
- 调整组件嵌套结构,把
Image组件作为ImageModal的子元素传入,将source属性移动到Image组件上,同时给Image设置和modalImageStyle匹配的基础尺寸,示例代码如下:
// 先导入必要依赖 import { Image } from 'react-native'; import ImageModal from 'react-native-image-modal'; // 组件使用代码 <ImageModal imageBackgroundColor="#000000" modalImageResizeMode="contain" modalImageStyle={{ width: 250, height: 250, }} > <Image source={{ uri: 'https://cdn.pixabay.com/photo/2019/07/25/18/58/church-4363258_960_720.jpg', }} style={{ width: 250, height: 250 }} /> </ImageModal>
- 如果调整后仍存在TypeScript类型报错,可升级组件到最新版本,避免旧版本类型定义不完善导致的异常:
npm install react-native-image-modal@latest
或者用yarn安装:yarn add react-native-image-modal@latest
内容的提问来源于stack exchange,提问作者Hans
相关产品推荐
相关产品推荐

