我得到一些错误，而导入JSON文件使用模板文字在反应打字稿。
export interface IData {
BASE_PRICE: number;
TIER: string;
LIST_PRICE_MIN: number;
LIST_PRICE_MAX: number;
DISCOUNT_PART_NUM: Discout;
}
type Discout = {
D1RJ6LL: number;
D1RJ8LL: number;
D1RJALL: number;
};
const [data, setData] = useState<IData[]>([]);
useEffect(() => {
fetchPrice(lang);
}, [lang]);
const fetchData = (lang: string) => {
if (lang) {
const data = import(`../locales/${lang}.json`);
setData(data); // its giving me error like Argument of type 'Promise<any>' is not assignable to parameter of type 'SetStateAction<IData[]>
}
};
我尝试了这种方式，我没有得到任何问题，但我也无法以正确的方式看到数据
const fetchPrice = async (lang: string) => {
if (lang) {
const priceRangeData = import(`../locales/${lang}.json`);
setData(await priceRangeData);
}
};
您的问题源于import是一个异步函数，它将始终返回一个带有数据的Promise。您的fetchPrice已经通过成为一个异步函数来处理这个问题，然后它可以像您在setData（await priceRangeData）中所做的那样等待Promise。因此，解决方案是对fetchData执行相同的操作，如下所示：
const fetchData = async (lang: string) => {
if (lang) {
const data = await import(`../locales/${lang}.json`);
setData(data);
}
};
您只需要使fetchData成为异步函数并在import（）之前make await，因为它返回Promise。不要忘记make类型断言。
const fetchData = async (lang: string) => {
if (lang) {
const data = await import(`../locales/${lang}.json`);
setData(data.default as IData[]);
}
};
