时间戳

首页 > 解决方案 > 反应原生 json 图像

json - 反应原生 json 图像

问题描述

我想将 JSON 图像打印为变量。

这是我的本地 JSON 文件 (JsonData.json)：

  {
  "appetizer": [
    {
      "num": "appetizer1",
      "name": "salad",
      "condition": [ "1", "2" ],
      "image": "./appetizer/salad.png"
    },
    {
      "num": "appetizer2",
      "name": "soup",
      "condition": [ "2", "3" ],
      "image": "./appetizer/soup.png"
    },
    …
   ],

  "main": [
    {
      "num": "main1",
      "name": "beef",
      "condition": [ "1" ],
      "image": "./main/beef.png"   
    },
    {
      "num": "main2",
      "name":  "fish",
      "condition": [ "2", "3" ],
      "image": "./main/fish.png"     
    },
   …
  ]
}

我在条件 =“2”时过滤了名称。（沙拉、汤、鱼）

这是过滤名称的代码：

const newArray1 = [...JsonData["apptizer"], ...JsonData["main"]];
const JsonResult = newArray1.filter(item => {
  if(item.condition.indexOf("2") !== -1) return item.name;
});

并且我想在条件 =“2”时获取图像。

我怎样才能得到它们？我怎样才能打印出来？

我必须使用base64吗？如果是这样，你能告诉我如何使用它吗？我看到了解释，但我无法理解。

我以这种方式导入了 JSON 文件（我一直在正确使用它）：

var JsonData = require('./JsonData.json');

标签： jsonimagereact-native

解决方案

您可以使用以下代码：

    let mainObject = JSON.parse(JSON.stringify(data))
    let allKeys = Object.keys(mainObject)
    let finalObject = []
    allKeys.map((value, index) => {
        let array = mainObject[value]
        array.map((aryObject, aryIndex) => {
            let condition = aryObject['condition']
            if (condition.includes('2')) {
                finalObject.push(aryObject)
            }
        })
    })
    alert(JSON.stringify(finalObject))

您可以在屏幕顶部导入数据：

import { data } from './data';

您可以在data.js中添加以下文本：

export const data = {
    "appetizer": [
        {
            "num": "appetizer1",
            "name": "salad",
            "condition": ["1"],
            "image": "./appetizer/salad.png"
        },
        {
            "num": "appetizer2222",
            "name": "soup",
            "condition": ["2", "3"],
            "image": "./appetizer/soup.png"
        },
    ],
    "main": [
        {
            "num": "main1",
            "name": "beef",
            "condition": ["1"],
            "image": "./main/beef.png"
        },
        {
            "num": "main2",
            "name": "fish",
            "condition": ["21", "3"],
            "image": "./main/fish.png"
        },
    ]
}

推荐阅读