React-native-image-viewer: Seems the module doesn't work out of the box?

Created on 9 Feb 2017  路  9Comments  路  Source: ascoders/react-native-image-viewer

I have just followed the instruction from readme but getting the following error:

Warning: Failed prop type: Invalid prop `source` supplied to `Image`.
    in Image (created by ImageViewer)
    in ImageViewer (created by Transmit)
    in Transmit (created by myproject)
    in RCTView (created by View)
    in View (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer (created by Modal)
    in RCTView (created by View)
    in View (created by Modal)
    in RCTModalHostView (created by Modal)
    in Modal (created by myproject)
    in myproject
    in RCTView (created by View)
    in View (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer


RCTJSONStringify() encountered the following error: Invalid type in JSON write (NSURL)

Is that because my react version is too new? I have tried with 0.39 and 0.41, both failing. Thanks in advance

Most helpful comment

@fdjiangwu Try to preset width and height? https://github.com/ascoders/react-native-image-viewer/blob/master/image-viewer/image-viewer.component.tsx#L136

const images = [{
    url: 'data:image/png;base64,.....',
    width: 200,
    height: 200
}]

All 9 comments

Invalid prop `source` supplied to `Image` seems like you set error source.

I saw the latest version of the image component, source field has not been modified, it seems like you set wrong url field.

i just copy the same source from the example

i have error same of you

I has this error at android. my image url is base64 string.

url: "data:image/jpeg;base64,/9j/4QFy..."

has anyone fix it?

i have error same of you on RN0.41, i just copy the same source from the example

That's true. I'm looking for reasons.

Well, don't worry, because the link address protocol in demo is blocked. There's no problem with a new address:

const images = [{
    url: 'https://avatars2.githubusercontent.com/u/7970947?v=3&s=460'
}, {
    url: 'https://avatars2.githubusercontent.com/u/7970947?v=3&s=460'
}, {
    url: 'https://avatars2.githubusercontent.com/u/7970947?v=3&s=460'
}]

It was solved? I tried a Base64 with RN 0.42 and still not work. Direct on the ImageView it works :/

@fdjiangwu Try to preset width and height? https://github.com/ascoders/react-native-image-viewer/blob/master/image-viewer/image-viewer.component.tsx#L136

const images = [{
    url: 'data:image/png;base64,.....',
    width: 200,
    height: 200
}]
Was this page helpful?
0 / 5 - 0 ratings