如何在 php 端回显来自 javascript 的发布数据以进行开发？

Question

我正在使用 Symfony 5，我正在使用 axios 将来自 javascript 的数据发布到 php 服务器端。 出于开发目的，我希望将发布的数据显示在页面上，以便我可以更好地构建和查看它们。

js文件

const onSubmit = () => {
    axios.post('mystuff/post', data)
    .then(response => {
        console.log(response.data)
    })
    .catch(err => {
        console.log(err);
    })
}

php文件

/**
 * @Route("/mystuff/post")
 */
public function postData(Request $request)
{
    $post_data = $request->getContent();
    return new JsonResponse($post_data)
}

上面的代码通过将数据扔回js端并控制台将其注销来工作，但是在控制台中很难真正看到它们。 所以我想要一些东西，比如在控制器中回显数据并在页面上正确显示它们。 我怎样才能做到这一点？

Answer 1

我刚刚发现了一个反应组件react-json-pretty可以做到这一点。 我只是传入 json 响应字符串，它将按层次结构顺序对其进行格式化。

js文件

import JSONPretty from 'react-json-pretty';

const App = () => {
    const [jsonString, setjsonString] = useState("");

    const onSubmit = () => {
        axios.post('mystuff/post', data)
        .then(response => {
            setjsonString(response.data);
        })
        .catch(err => {
            console.log(err);
        })
    }

    return(
        <>
            <JSONPretty id="json-pretty" data={jsonString}></JSONPretty>
            <button onClick={onSubmit}>Submit</button>
        </>
    )

}