React Native: require() với Chuỗi động?

Question

Tôi đã đọc nhiều bài viết về các vấn đề mà mọi người đang có với React Native và require() chức năng khi cố gắng đòi hỏi một nguồn lực năng động như:

động (thất bại):

urlName = "sampleData.json"; 
data = require('../' + urlName); 

vs. tĩnh (thành công):

data = require('../sampleData.json'); 

tôi đã đọc trên một số đề rằng đây là một lỗi trong Phản ứng Native và ở những người khác rằng đây là một tính năng.

Có cách nào mới để yêu cầu tài nguyên động trong một hàm không?

Bài viết liên quan (tất cả khá cũ trong Phản ứng thời gian):

• Importing Text from local json file in React native
• React Native - Dynamically List/Require Files In Directory
• React Native - Image Require Module using Dynamic Names
• React Native: how to use require(path) with dynamic urls?

Answer 1

Bạn đang sử dụng một mô-đun bundler như webpack?

Nếu vậy, bạn có thể thử require.ensure()

Xem: https://webpack.js.org/guides/code-splitting/#dynamic-imports

Answer 2

Như tôi đã nghe nói, phản ứng của require() chỉ sử dụng url tĩnh không biến, đó có nghĩa là bạn phải làm require('/path/file'), hãy xem điều này issue on github và this one để có thêm giải pháp thay thế, có một số cách khác để thực hiện! cho ví dụ

const images = { 
profile: { 
    profile: require('./profile/profile.png'), 
    comments: require('./profile/comments.png'), 
}, 
    image1: require('./image1.jpg'), 
    image2: require('./image2.jpg'), 
}; 

export default images; 

sau đó

import Images from './img/index'; 

render() { 
    <Image source={Images.profile.comments} /> 
} 

từ này answer