Доступ к статическим/локальным изображениям в React Native

В моей папке проекта React Native у меня есть файлы src, содержащие компоненты, а также несколько изображений, которые я хочу использовать как для iOS, так и для Android. Если я использую это:

<Image style={{ width: 200, height: 200 }} source={require('../images/camera.png')} />

тогда изображение загружается отлично. Однако источник в теге изображения будет создаваться динамически, когда пользователь делает снимок. Этот код:

<Image style={{ width: 200, height: 200 }} source={{ uri: '../images/camera.png' }} />

не работает. Никаких ошибок не выдается, но изображение не отображается. Я уверен, что я на правильном пути, поскольку он вернет изображения, снятые камерой и сохраненные на устройстве, с использованием того же кода, когда я заменю источник реквизитом (<Image style={{ width: 200, height: 200 }} source={{ uri: this.props.image }} />), но для статического изображения этого не происходит. Предложения?


person Sternjobname    schedule 31.10.2016    source источник


Ответы (1)


Для статических изображений необходимо указать, как показано ниже source

source={require('static_image_path_relative_current_directory')

Только для удаленных и локальных файлов (не статических) нам нужно указать uri в source, как показано ниже.

source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}
person Jickson    schedule 01.11.2016
comment
Красиво - спасибо! Я подумал, что может быть способ использовать URI для статики; если нет, то я просто сделаю пару разных модулей, чтобы справиться с этим. - person Sternjobname; 01.11.2016