Невозможно использовать имя переменной внутри Node.js требуют

Question

Я хочу импортировать изображение в мое собственное приложение реакции локально.

render() {

    console.log(this.props.image);   //   this logs '../../images/avatartest.jpg' every time

    let test = require (this.props.image!);   //    bang is required because of interface
    return (
        <ImageBackground
            source={test}
        >
        </ImageBackground>
    );
}

Запуск этого кода приводит к этой ошибке:

Нет ли способа принять имя переменной со строкой?

Answer 1

Здесь вы пытаетесь динамически импортировать изображение, которое не поддерживается. Лучший способ сделать это - предварительно запросить изображения и передать требуемое значение в качестве реквизита.Предположим, что родительским компонентом для вашего компонента является ImageView

export default const images = {
   img1:require('IMAGE_URL')
}

//import this in the your view and use it as the prop value 
<ImageView image={images.img1}></ImageView>

Приведенный выше метод гарантирует, что упаковщик может найти изображение.

Answer 2

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

Вы можете связывать изображения в вашем приложении вручную и использовать, где будут работать переменные.

<Image source={{ uri: this.props.image }} />