Javascript 从Django render（）到React.js的JSON_Javascript_Json_Reactjs_Django

Javascript 从Django render（）到React.js的JSON

javascript json reactjs django

Javascript 从Django render（）到React.js的JSON,javascript,json,reactjs,django,Javascript,Json,Reactjs,Django,我正在编写一个简单的Django+React应用程序，其中我想将一些JSON从Django render（）传递到React.js。我首先用Django呈现一个HTML页面，提供JSON。虽然我不知道格式，但数据是通过的，正如我可以使用Django的模板语言显示的那样。但是，在由HTML页面调用的React代码中，我将JSON作为字符串获取，并且仅获取前10个字符。我想知道是否有一种方法可以正确地完成这个任务，而不是每次都要写一篇http文章 My Django views脚本，用于呈现html

我正在编写一个简单的Django+React应用程序，其中我想将一些JSON从Django render（）传递到React.js。我首先用Django呈现一个HTML页面，提供JSON。虽然我不知道格式，但数据是通过的，正如我可以使用Django的模板语言显示的那样。但是，在由HTML页面调用的React代码中，我将JSON作为字符串获取，并且仅获取前10个字符。我想知道是否有一种方法可以正确地完成这个任务，而不是每次都要写一篇http文章

My Django views脚本，用于呈现html：

@login_required(login_url="/login/")
def index(request):
    data = {
        'key': [0, 1, 2, 3],
        'key2': 'abcd',
    }
    context = {
        'data': json.dumps(data),
        'navItem': 0,
    }
    return render(request, "index.html", context)

My index.html：

<!DOCTYPE html>
<html lang="en">
<body>
    {{data}}
    <div class="reactitem" data-json={{data}}></div>
    <script src="http://127.0.0.1:8080/index.js" charset="utf-8"></script>
</body>
</html>

加载页面时，我会在屏幕上看到完整的数据json，同时在控制台中获得以下输出：

{"key":
string
7

我已经看到这个概念应用于大型生产解决方案中。这是一种有效的方法

给定内容已序列化为

然后可以反序列化到JS对象

const el=document.querySelector（“[datajson]”）；
const json=json.parse（el.dataset.json）；
console.log（json）

这将在控制台中呈现

{someKey:“someValue”}

HTML也可能是这样。但是应该转义

“

“当我加载页面时，我会在屏幕上看到完整的json数据”似乎您需要避开json内容，并在使用时取消浏览。谢谢您的评论。逃离和逃避似乎有效，但仅适用于弦。但是，你知道是否还有其他方法，特别是对于大型JSON，转义过程似乎效率很低？

{"key":
string
7