我正在使用Adobe After Effects和React Lottie创建动画，并且我有很多由bodymovin扩展名生成的json文件。我以这种方式导入文件：
import * as initial from './white_bird.json';
import * as hoverOn from './white_bird_hover_on.json';
import * as hoverOff from './white_bird_hover_off.json';
但是，当我有6个其他组件看起来相同，但仅在导入文件时彼此不同。我该如何在上面这样写这些行：
const data = {
initial: import * as initial(`./${some_param}.json`),};
请注意，我必须以另一种不起作用的方式将其导入为'* as'
您可以使用Dynamic import：
useEffect(() => {
async loadData() {
const data = await import(`./${some_param}.json`);
setInitial(data);
}
loadData();
},[])
，如果有多个请求，请使用Promise.all：
useEffect(() => {
async loadData() {
const [initalData,hoverOnData,hoverOffData] = await Promise.all([
import(`./${bird}.json`),import(`./${bird}_hover_on.json`),import(`./${bird}_hover_off.json`)
]);
setInitial(initalData);
setHoverOn(hoverOnData);
setHoverOff(hoverOffData);
}
loadData();
},[])
我找到了解决方案，导入返回了Promise，以后我可以轻松地将文件中的数据设置为state，现在可以正常使用了。
import AsyncStorage from "@react-native-community/async-storage";
export const Storage {
getItem: async (key) => {
try {
let result = await AsyncStorage.getItem(key);
return JSON.parse(result);
}
catch (e) {
throw e;
}
},setItem: async (key,value) => {
try {
const item = JSON.stringify(value);
return await AsyncStorage.setItem(key,item);
} catch (e) {
throw e;
}
}
}
// usage
async function usage () {
const isLeeCool = true;
const someObject = { name: "Dave" };
const someArray = ["Lee","Is","Cool."];
try {
// Note Async storage has a method where you can set multiple values,// that'd be a better bet here (adding it to the wrapper).
await Storage.setItem("leeIsCool",leeIsCool);
await Storage.setItem("someObject",someObject);
await Storage.setItem("someArray",someArray);
} catch (e) {}
// Some point later that day...
try {
console.log(await Storage.getItem("leeIsCool"));
console.log(await Storage.getItem("someObject"));
console.log(await Storage.getItem("someArray"));
} catch (e) {}
}