I am facing an error while using a Template literal in React TypeScript to import a JSON file.
export interface IData {
BASE_PRICE: number;
TIER: string;
LIST_PRICE_MIN: number;
LIST_PRICE_MAX: number;
DISCOUNT_PART_NUM: Discout;
}
type Discount = {
D1RJ6LL: number;
D1RJ8LL: number;
D1RJALL: number;
};
const [data, setData] = useState<IData[]>([]);
useEffect(() => {
fetchData(lang);
}, [lang]);
const fetchData = (lang: string) => {
if (lang) {
const jsonData = import(`../locales/${lang}.json`);
setData(jsonData); // I encountered an error saying "Argument of type 'Promise<any>' is not assignable to parameter of type 'SetStateAction<IData[]>"
}
};
I attempted this approach and did not encounter any issues, but the data is not displaying properly.
Here is an image:
const fetchPrice = async (lang: string) => {
if (lang) {
const priceRangeData = import(`../locales/${lang}.json`);
setData(await priceRangeData);
}
};