如何在 JavaScript 中从 Django REST 获取数据

Question

我是 Javascript 的新手，所以帮我弄清楚

我有简单的数据休息：

[
    {
        "id": 1,
        "content": "Hello Tweet"
    }
]

我试图在我的<script> 中获取此信息

<script>
        const tweetsElement = document.getElementById('tweets')

        const xhr = new XMLHttpRequest();
        const method  = 'GET'
        const url = '/tweets'
        const responseType ='json'
        
        
        xhr.responseType = responseType
        xhr.open(method,url)
        xhr.onload = function(){
            
            const serverResponse = xhr.response
            const listedItems = serverResponse.response
            console.log(listedItems)
            var finalTweetStr = ""
            var i;
            for(i=0;i<listedItems.length;i++){
                console.log(i)
                console.log(listedItems[i])
                var currentItem = "<div class='mb-4'><h1>"+listedItems[i].id +  "</h1>"+"<p>"+ listedItems[i].content+"</p></div>"
                 finalTweetStr += currentItem
            }
            tweetsElement.innerHTML = finalTweetStr;
        }
        xhr.send();
    </script>

但是不行，问题出在哪里？

Answer 1

您的主要问题似乎在这里：

const serverResponse = xhr.response
const listedItems = serverResponse.response

改成：

const listedItems = xhr.response

您可以删除多余的serverResponse 变量。