从 JS 中的 observable 返回结果答案

【问题标题】：return result from observable in JS从 JS 中的 observable 返回结果
【发布时间】：2020-02-25 06:46:42
【问题描述】：

我有一个具有可观察对象的函数，我需要返回我在该函数中使用的 fetch 的值。但是我不知道为什么我在显示结果时无法返回结果它完全没问题但是当我尝试返回时它是空的。

我检查了一些类似的问题，但它们非常复杂，而且它们也不符合我的情况，而且在尝试了其中的一两个之后，问题仍然存在。

function getRandomQuote() {
    const obs$ = Observable.create(async(observer) => {
        const result = await fetch(RANDOM_QUOTE_API_URL)
            .then(Response => Response.json())
            .then(data => data.content)

        observer.next(result)
        console.log(result)
    })

    return obs$.subscribe(x => { return x })
}

我尝试仅在订阅部分内使用 return，但它不起作用，在类似的情况之一中，他们试图返回我尝试过但仍然不起作用的外部部分

我是 observable 和 JavaScrip 的新手，我只需要返回这个值并在另一个函数中使用它。谢谢

【问题讨论】：

你为什么要退货？您可以从任何组件订阅它以获取数据。
我想在这个函数中使用它async function renderNewQuote() { const quote = await getRandomQuote() quoteDisplayElement.innerHTML = '' quote.split('').forEach(character => { const characterSpan = document.createElement('span') characterSpan.innerText = character quoteDisplayElement.appendChild(characterSpan) }) quoteInputElement.value = null startTimer() }如何在这里订阅它
你能检查一下这个的第一个答案吗：stackoverflow.com/questions/40530108/…。首先创建Observer并订阅获取数据@AliDK
最好返回 observable，并从外部订阅它。

标签： javascript rxjs observable

【解决方案1】：

你应该返回Observable而不是Subscription

function getRandomQuote() {
    return Observable.create(async(observer) => {
        const result = await fetch(RANDOM_QUOTE_API_URL)
            .then(Response => Response.json())
            .then(data => data.content)
        observer.next(result)
    })
}
//usage 
    getRandomQuote().subscribe(console.log)

或者有 defer() 和 from() 运算符可以帮助您将 promise 转换为 observable

getRandomQuote=()=>defer(()=>from(fetch(RANDOM_QUOTE_API_URL)
            .then(Response => Response.json())
            .then(data => data.content))

//usage 
getRandomQuote().subscribe(console.log)

【讨论】：

首先感谢您的帮助，我没有弄明白，但最后，我明白了，我可以在订阅中编写函数，而不是返回值