Salut à tous,

Je sollicite votre aide car je rencontre un souci avec l'import et l'affichage d'images depuis un dossier sur mon app React-native.
Je cherche à créer une gallerie via une boucle sur une liste d'images (stockées en local pour le moment pour la phase de dev).

Lorsque je boucle sur les éléments afin de créer une image via le composant Image, j'ai cette erreur qui m'est retournée (premier élément) : Unknown named module: './img/img_1.jpg'.

J'ai cherché un bout de temps, et pas moyen de résoudre le problème.. j'ai essayé en mettant un objet en paramètre de l'attribut source ({ uri: src }), en redémarrant l'émulateur Android et expo, le problème reste le même..
Le dossier existe bel et bien, les permissions sur celui-ci et sur les images sont bonnes... j'avoue que je sèche ^^" !

Ci-dessous mon code :


 /* ... */

const imgs = [
    './img/img_1.jpg',
    './img/img_2.jpg',
    './img/img_3.jpg',
    './img/img_4.jpg',
]

export default class Home extends Component {

    /* ... */

    image (src) {
        return <Image style={this._style().image} source={require(src)} />
    }

    render () {
        const styles = this._style()
        return (
            <View style={styles.container}>
                <StatusBar hidden={true} />
                {imgs.map(this.image.bind(this))}
            </View>
        )
    }

    /* ... */

}

Si quelqu'un a une idée (ou la solution !) je suis prenneur :)

Merci !

2 réponses


Yo,
j'avais fait des tests il y a quelques temps et je m'étais confronté au même problème. Ayant survolé le sujet, je ne vais peut-être pas beaucoup t'aider mais je m'en étais sorti en mettant le require dans mon objet (ici imgs) et ensuite j'utilisai une ListView.

betaWeb
Auteur

Salut,

Effectivement, j'ai creusé les issues sur github et il en ressort que React-Nativ ne gère pas (pour le moment en tout cas= les require ayant un attribut dynamique.
Merci pour le tip, je vais tester ça ;)