如何仅显示 JSON 字符串中的值答案

【问题标题】：How do I only display the value from JSON String如何仅显示 JSON 字符串中的值
【发布时间】：2021-04-17 08:08:54
【问题描述】：

useEffect(() => {
        axios.get("http://localhost:8080/application").then((response) => {
            setListofApplications(response.data)
        });
    }, []);


         <main id="body-content">
            <div>
                <Table>
                    <thead>
                        <tr>
                            <th scope="col">ID</th>
                            <th scope="col">Display Name</th>
                            <th scope="col">Type</th>
                            <th scope="col">Response</th>
                            <th scope="col">Submitted Date</th>
                            <th scope="col">Approval</th>
                        </tr>
                    </thead>
                    <tbody>
                    {listofApplications.map((value) => {
                        let data = 
                         JSON.parse(JSON.stringify(value.application_data));
                        return <tr>
                            <td>{value.id}</td>
                            <td>{value.display_name}</td>
                            <td>{value.application_type}</td>
                            <td>{data.first_name}</td>
                            <td>{value.createdAt}</td>
                            <td>{value.approval}</td>
                        </tr>
                    })}
                    </tbody>
                </Table>
            </div>
        </main>



const initalValues= {
        display_name: "",
        applicaiton_data: [{
            "first_name": '',
            "middle_i": '',
            "last_name": '',
            "rp_name": '',
            "age": '',
            "email": '',
            "history": '',
            "expirence": '',
            "why": '',
            "bring": '',
            "vac_ban": '',
        }],
        application_type: "",
        approval: "false",
    };
1 Test ca ["first_name":"test","middle_i":"test","last_name":"test","rp_name":"test","age":"test","email":"test","history":"test","experience":"test","why":"test","bring":"test","vac_ban":"test"] false 2021-04-17


(Response)
0:
application_data: "[
\"first_name\":\"test\",
\"middle_i\":\"test\",
\"last_name\":\"test\",
\"rp_name\":\"test\",
\"age\":\"test\",
\"email\":\"test\",
\"history\":\"test\",
\"experience\":\"test\",
\"why\":\"test\",
\"bring\":\"test\",
\"vac_ban\":\"test\
"]"
application_type: "ca"
approval: "false"
createdAt: "2021-04-17"
display_name: "Jerome_M"
id: 1
updatedAt: "2021-04-17"

这就是我返回页面的内容（不担心设计，只是想知道如何正确调用它。这些值一旦提交就不会改变，只是阅读。这就是我选择 json 路由的原因。

如何只显示字符串而不显示“”？

添加了我如何使用表格在页面上显示数据。如果我必须改变它，我不介意。只是想学习如何正确地做到这一点。

【问题讨论】：

您能否提供此输出的代码和框链接
你想读什么？底部的数组？你在哪里读它？
我不能，代码有两个部分客户端和服务器。但是代码的输出是 1 Test ca ["first_name":"test","middle_i":"test","last_name":"test","rp_name":"test","age":"test" ,"email":"test","history":"test","experience":"test","why":"test","bring":"test","vac_ban":"test"] false 2021-04-17
我已经在阅读它，它是通过使用 axios.get 从数据库中调用的我只是打印出 {value.id} {value.display_name} {value.application_type} {value .application_data} {value.approval} {value.createdAt}
1 是 {value.id} 测试是 {value.dispay_name} ca 是 {value.application_type} 数组是 {value.application_data} false 是 {value.approval} 数据是 {value.createdAt }

标签： json reactjs axios

【解决方案1】：

为了显示没有“”的 JSON（到对象中），您可以使用 JSON.parse()

var json = '{"name":"John", "age":30, "city":"New York"}'

var obj = JSON.parse(json);

console.log(obj.name + ", " + obj.age)

【讨论】：

对不起，我应该说我是从数据库中调用数据。
它不会改变它的来源。如果您有一个想要成为对象的 JSON，请使用 JSON.parse。
好的，我更新了问题以反映我认为你的意思。
如果我只做 JSON.parse(value.applicaiton_data) 它会引发跨源错误
这是另一回事。如果您还有其他问题，请随时发帖。