如何从 Jquery 中的 Object Promise 返回值

Question

I am trying to return the values from the object of Promises, the values are printed in the console but when I am displaying it on the HTML, it is showing "OBJECT PROMISE" in place of the returned Value.我试图从 Promises 的 object 返回值，这些值打印在控制台中，但是当我在 HTML 上显示它时，它显示“对象承诺”代替返回的值。 My code is我的代码是

const priceConversion = async(data) =>{
    const url = 'http://www.geoplugin.net/json.gp?'
    const response = await  fetch (url)
    const resJSON = await response.json()
    const val =  resJSON['geoplugin_currencySymbol'] + Math.round(data * resJSON['geoplugin_currencyConverter'])
    return val
    
  }

The type of val returned is String here.这里返回的 val 的类型是 String。 but as soon as it is called from an object, it gives the above mentioned output, ie "Object Promise" The code for the Object is但是一旦从 object 调用它，它就会给出上述 output，即“对象承诺” Object 的代码是

  let price = {
      basic:{
          monthly: priceConversion(0),
          annual:priceConversion(0)
        },
        standard:{
            monthly:priceConversion(9),
            annual:priceConversion(4.5),
        },
        premium:{
            monthly:priceConversion(17),
            annual:priceConversion(7)
        }
    }

For Document manipulation, I am using the following method对于文档操作，我使用以下方法

let monthly = true
if (monthly === true){
    $("#freeMonthly").empty().text(`${price.basic.monthly}`)
    $("#standardMonthly").empty().text(`${price.standard.monthly}`)
    $("#premiumMonthly").empty().text(`${price.premium.monthly}`)
}

It would be really great if anyone could help with this one as I couldn't find any solution that could resolve this issue.如果有人可以帮助解决这个问题，那就太好了，因为我找不到任何可以解决这个问题的解决方案。 Thank You!谢谢你！

Answer 1

Try to wrap everything in an async function and use await every time you call your function:尝试将所有内容包装在async function 中，并在每次调用 function 时使用await ：

 const priceConversion = async(data) => { const url = 'http://www.geoplugin.net/json.gp?' const response = await fetch(url) const resJSON = await response.json() const val = resJSON['geoplugin_currencySymbol'] + Math.round(data * resJSON['geoplugin_currencyConverter']) return val } const calculatePrice = async() => { return { basic: { monthly: await priceConversion(0), annual: await priceConversion(0) }, standard: { monthly: await priceConversion(9), annual: await priceConversion(4.5), }, premium: { monthly: await priceConversion(17), annual: await priceConversion(7) } } } const main = async() => { try { console.log("In the main") const price = await calculatePrice() let monthly = true if (monthly === true) { $("#freeMonthly").empty().text(`${price.basic.monthly}`) $("#standardMonthly").empty().text(`${price.standard.monthly}`) $("#premiumMonthly").empty().text(`${price.premium.monthly}`) } } catch (err) { console.log(err) } } main()

 <html> <head> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <body> <div id="freeMonthly">freeMonthly</div> <div id="standardMonthly">standardMonthly</div> <div id="premiumMonthly">premiumMonthly</div> </body> </html>

如何从 Jquery 中的 Object Promise 返回值

问题描述

1 个解决方案

解决方案1
0 已采纳 2021-06-08 14:48:34

如何从 Jquery 中的 Object Promise 返回值

问题描述

1 个解决方案

解决方案1 0 已采纳 2021-06-08 14:48:34

解决方案1
0 已采纳 2021-06-08 14:48:34