javascript - 如何调用一个返回 fetch 调用的函数？香草JS

Question

如何在下面的另一个函数上调用此函数？：代码来自（Vanilla JS DOM 操作（节点渲染不一致））

return在 fetch 之前和最后一部分记下代码

function getCarouselCard(){
    var url = "/sample-url/"

    return fetch(url)
    .then((response) => response.json())
    .then(function(data){

       //do some stuff here

        return card
    })
}

我以这种方式完成了上面发布的代码，因为我需要使用以下方法重新排列页面的 fetch 调用顺序：

注意：我从在这里回答我的问题的人那里得到了下面的代码（检查评论部分）Vanilla JS DOM 操作（节点渲染不一致）。我不明白 Promise 是如何工作的，所以我只是尝试了代码并且它有效

somefunction() {
        Promise.all([getLogoCard(), getCarouselCard(), getMissionCard(), getVisionCard()]).then((values) => {
            values.forEach(card=> pageContent.append(card))
        }).then(function(){
            //do some stuff here
        })
}

现在，我需要getCarouselCard()在另一个函数中调用该函数，代码如下所示：

function deleteCarouselForm(id){
    var form = document.getElementById('carousel-delete-form')
    form.addEventListener('submit', function(e){
        e.preventDefault()

        var url = `/web-content/api/home-carousel/delete/${id}/`

        fetch(url, {
            method: 'DELETE',
            headers: {
                "Content-type": 'application/json',
                "X-CSRFToken": csrftoken,
            },
            // body: JSON.stringify()
        })
        .then(function(){
          getCarouselCard()
        })
    })
}

并且通过简单地调用getCarouselCard()不起作用，我什至尝试这样做：

.then(function(){
             Promise.all([getCarouselCard()]).then((values) => {
             values.forEach(card=> pageContent.append(card))})
             //the same way how I called `getCarouselCard()` function in another function
})

我是 javascript 新手，所以如果有人可以帮助我解决这些问题，我将不胜感激。谢谢！

标签： javascriptfrontend