javascript - マップされた変数を画像のソースに入れる

Question

私はスタックを検索しましたが、私が達成したいことに基づいてこの質問をする人は誰もいないようです。私は配列を介してマッピングしており、マップされた変数の名前を画像のソースとして使用したい、つまり、それを連結します.jpg

これは私が以下で試みたものですが、calls torequire expect exactly 1 string literal argument, but this was found:require('./' + herb.name + '.jpg') というエラーが発生.します。

 const herbs = this.state.record.map((herb) =>
 <View key={herb.id} style={BackStyles.herb_box}>
 <Image style={BackStyles.image} source={require('./'+herb.name+'.jpg')}/>
 <View style={{flexDirection: 'column',}}><Text style={BackStyles.header}>{herb.name}</Text> <Text style={BackStyles.sub}>{herb.bot}</Text></View>
            </View>
        );