首页 > 解决方案 > 如何在屏幕上显示之前将一些数据映射到从 API 获取的数据?

问题描述

我是 React Native 的新手。我正在尝试制作自己的应用程序来尝试我学到的不同事物并了解新事物,而我遇到的一件让我很难过的事情是以下问题:我有一个 API这给了我关于某个项目的某些数据。项目的属性在 API 中列出,如“sizeofitem”、“nameofitem”或“itemacategory”。现在有多个项目用于不同的项目,并且并非每个项目中都存在所有属性。我试图实现的是以某种方式以下列方式映射这些属性:如果让我们说“sizeofitem”,应该成为“项目的大小”,“nameofitem”应该成为“项目的名称”。现在这些属性在所有项目中都不同,例如,sizeofitem 可能在一个项目详细信息列表中,但可能不在另一个列表中,但我拥有所有可能存在的属性。有人可以帮我怎么做吗?

到目前为止,我有以下内容:

const [itemDtl , setItemDtl] = useState([]);

const getItemInfo = async (id) => {
        try{
            const response = await api.get(`myAPI/${id}`);
            setItemDtl(response.data.obj.itemutils);

        }catch(err){
            console.log(err);
        }
    }
let arr = [];
for(let i in itemDtl){

   arr.push(itemDtl[i].util_type);
}
console.log(arr);

useEffect(() => {
    getItemInfo(id);
})

arr 数组具有为 API 中的项目列出的任何属性,即 [sizeofitem、nameofitem 等]。

我希望一个数组具有 [Size of Item, Name of Item 等]。

基本上,总而言之,我想重命名可以存在的属性列表,以便在出现任何属性时将其存储在一个数组中,其中包含我给定的映射字符串,例如,如果一个项目具有 'sizeofitem : 50 ',我希望将其存储为“项目大小”,以便我可以在屏幕上显示它。并且一个项目总共可以存在 5 个属性,所以我可以在某个地方对其进行编码,sizeofitem : 'Size Of Item'这样当 sizeofitem 属性显示在屏幕上时,我可以使用它并在屏幕上显示项目的大小。

标签: react-native

解决方案


尝试这个:

const [itemDtl , setItemDtl] = useState([]);

const getItemInfo = async (id) => {
        try{
            const response = await api.get(`myAPI/${id}`);
            let arr = [];
            for(let i in itemDtl){
              arr.push(itemDtl[i].util_type);
            }
            setItemDtl(arr);

        }catch(err){
            console.log(err);
        }
    }


useEffect(() => {
    getItemInfo(id);
})

推荐阅读